Addresses #1361, #1336 , #1290 (WIP)

pull/1750/head
noramullen1 2020-09-08 13:52:53 -07:00
parent c26539c9c6
commit 36e06203b7
10 changed files with 117 additions and 8 deletions

View File

@ -0,0 +1,63 @@
---
title: Band visualization
list_title: Band
list_image: /img/influxdb/2-0-visualizations-Band-example.png
description: >
The Band view displays the single value most recent value for a time series in a Band view.
weight: 206
menu:
influxdb_2_0:
name: band
parent: Visualization types
---
The **Band** visualization displays the most recent value for a time series in a Band.
{{< img-hd src="/img/influxdb/2-0-visualizations-Band-example-8.png" alt="Band example" />}}
Select the **Band** option from the visualization dropdown in the upper left.
## Band behavior
The band visualization displays
## Band Controls
To view **Band** controls, click **{{< icon "gear" >}} Customize** next to the visualization dropdown.
###### Data
- **X Column**: The column to select data from.
- **Y Column**: The column to select data from.
- **Time Format**:
###### Options
- **Interpolation**:
- **Line Colors**:
- **Shade Area Below Lines**:
- **Hover Dimension**: Select a color scheme to use for your graph.
###### Y Axis
- **Y Axis Label**: Label for the y-axis.
- **Y-Value Unit Prefix**: None, SI, or Binary.
-
## Band examples
Band visualizations are useful for showing the current value of a metric and displaying
where it falls within a spectrum.
### Steam pressure Band
The following example queries sensor data that tracks the pressure of steam pipes
in a facility and displays it as a Band.
###### Query pressure data from a specific sensor
```js
from(bucket: "example-bucket")
|> range(start: -1m)
|> filter(fn: (r) =>
r._measurement == "steam-sensors" and
r._field == "psi"
r.sensorID == "a211i"
)
```
###### Visualization options for pressure Band
{{< img-hd src="/img/influxdb/2-0-visualizations-Band-pressure-8.png" alt="Pressure guage example" />}}

View File

@ -15,7 +15,7 @@ The **Gauge** visualization displays the most recent value for a time series in
{{< img-hd src="/img/influxdb/2-0-visualizations-gauge-example-8.png" alt="Gauge example" />}} {{< img-hd src="/img/influxdb/2-0-visualizations-gauge-example-8.png" alt="Gauge example" />}}
Select the **Gauge** option from the visualization dropdown in the upper right. Select the **Gauge** option from the visualization dropdown in the upper left.
## Gauge behavior ## Gauge behavior
The gauge visualization displays a single numeric data point within a defined spectrum (_default is 0-100_). The gauge visualization displays a single numeric data point within a defined spectrum (_default is 0-100_).

View File

@ -20,7 +20,7 @@ and overlays the single most recent value as a large numeric value.
{{< img-hd src="/img/influxdb/2-0-visualizations-line-graph-single-stat-example-8.png" alt="Line Graph + Single Stat example" />}} {{< img-hd src="/img/influxdb/2-0-visualizations-line-graph-single-stat-example-8.png" alt="Line Graph + Single Stat example" />}}
Select the **Graph + Single Stat** option from the visualization dropdown in the upper right. Select the **Graph + Single Stat** option from the visualization dropdown in the upper left.
## Graph + Single Stat behavior ## Graph + Single Stat behavior
The Graph visualization color codes each table (or series) in the queried data set. The Graph visualization color codes each table (or series) in the queried data set.

View File

@ -16,7 +16,7 @@ the [Graph controls](#graph-controls).
{{< img-hd src="/img/influxdb/2-0-visualizations-line-graph-example-8.png" alt="Line Graph example" />}} {{< img-hd src="/img/influxdb/2-0-visualizations-line-graph-example-8.png" alt="Line Graph example" />}}
Select the **Graph** option from the visualization dropdown in the upper right. Select the **Graph** option from the visualization dropdown in the upper left.
## Graph behavior ## Graph behavior
The Graph visualization color codes each table (or series) in the queried data set. The Graph visualization color codes each table (or series) in the queried data set.

View File

@ -19,7 +19,7 @@ represents different concentrations of data points.
{{< img-hd src="/img/influxdb/2-0-visualizations-heatmap-example.png" alt="Heatmap example" />}} {{< img-hd src="/img/influxdb/2-0-visualizations-heatmap-example.png" alt="Heatmap example" />}}
Select the **Heatmap** option from the visualization dropdown in the upper right. Select the **Heatmap** option from the visualization dropdown in the upper left.
## Heatmap behavior ## Heatmap behavior
Heatmaps divide data points into "bins" segments of the visualization with upper Heatmaps divide data points into "bins" segments of the visualization with upper

View File

@ -17,7 +17,7 @@ The y-axis is dedicated to count, and the X-axis is divided into bins.
{{< img-hd src="/img/influxdb/2-0-visualizations-histogram-example.png" alt="Histogram example" />}} {{< img-hd src="/img/influxdb/2-0-visualizations-histogram-example.png" alt="Histogram example" />}}
Select the **Histogram** option from the visualization dropdown in the upper right. Select the **Histogram** option from the visualization dropdown in the upper left.
## Histogram behavior ## Histogram behavior
The Histogram visualization is a bar graph that displays the number of data points The Histogram visualization is a bar graph that displays the number of data points

View File

@ -0,0 +1,46 @@
---
title: Mosaic visualization
list_title: Mosaic
list_image: /img/influxdb/2-0-visualizations-mosaic-example.png
description: >
The Mosaic view displays the single value most recent value for a time series in a mosaic view.
weight: 206
menu:
influxdb_2_0:
name: mosaic
parent: Visualization types
---
The **Mosaic** visualization displays the most recent value for a time series in a mosaic.
{{< img-hd src="/img/influxdb/2-0-visualizations-mosaic-example-8.png" alt="mosaic example" />}}
Select the **Mosaic** option from the visualization dropdown in the upper left.
## Mosaic behavior
The mosaic visualization displays
## Mosaic Controls
To view **Mosaic** controls, click **{{< icon "gear" >}} Customize** next to the visualization dropdown.
###### Data
- **FILL Column**:
- **X Column**: The column to select data from.
- **Y Column**: The column to select data from.
- **Time Format**:
###### Options
- **Color Scheme**: Select a color scheme to use for your graph.
###### X Axis
- **X Axis Label**: Label for the x-axis.
###### Y Axis
- **Y Axis Label**: Label for the y-axis.
## Mosaic examples
###### Visualization options for pressure mosaic
{{< img-hd src="/img/influxdb/2-0-visualizations-mosaic-pressure-8.png" alt="Pressure guage example" />}}

View File

@ -17,7 +17,7 @@ The **Scatter** view uses a scatter plot to display time series data.
{{< img-hd src="/img/influxdb/2-0-visualizations-scatter-example.png" alt="Scatter plot example" />}} {{< img-hd src="/img/influxdb/2-0-visualizations-scatter-example.png" alt="Scatter plot example" />}}
Select the **Scatter** option from the visualization dropdown in the upper right. Select the **Scatter** option from the visualization dropdown in the upper left.
## Scatter behavior ## Scatter behavior
The scatter visualization maps each data point to X and Y coordinates. The scatter visualization maps each data point to X and Y coordinates.

View File

@ -15,7 +15,7 @@ The **Single Stat** view displays the most recent value of the specified time se
{{< img-hd src="/img/influxdb/2-0-visualizations-single-stat-example-8.png" alt="Single stat example" />}} {{< img-hd src="/img/influxdb/2-0-visualizations-single-stat-example-8.png" alt="Single stat example" />}}
Select the **Single Stat** option from the visualization dropdown in the upper right. Select the **Single Stat** option from the visualization dropdown in the upper left.
## Single Stat behavior ## Single Stat behavior
The Single Stat visualization displays a single numeric data point. The Single Stat visualization displays a single numeric data point.

View File

@ -17,7 +17,7 @@ sometimes easier to analyze than graph views of data.
{{< img-hd src="/img/influxdb/2-0-visualizations-table-example.png" alt="Table example" />}} {{< img-hd src="/img/influxdb/2-0-visualizations-table-example.png" alt="Table example" />}}
Select the **Table** option from the visualization dropdown in the upper right. Select the **Table** option from the visualization dropdown in the upper left.
## Table behavior ## Table behavior
The table visualization renders queried data in structured, easy-to-read tables. The table visualization renders queried data in structured, easy-to-read tables.