Visualization updates

pull/935/head
noramullen1 2020-04-09 10:36:08 -07:00
parent 0e95828d2f
commit 48a361fb25
24 changed files with 31 additions and 41 deletions

View File

@ -12,7 +12,7 @@ weight: 203
## Control at the dashboard level
Use dashboard controls in the upper right to update your dashboard.
Use dashboard controls in the upper left to update your dashboard.
### Add a cell

View File

@ -14,7 +14,7 @@ weight: 201
## Create a new dashboard
1. Click the **Dashboards** icon in the navigation bar.
1. In the navigation menu on the left, select **Boards** (**Dashboards**).
{{< nav-icon "dashboards" >}}
@ -24,7 +24,7 @@ weight: 201
**To import an existing dashboard**:
1. Click the **Dashboards** icon in the navigation bar.
1. In the navigation menu on the left, select **Boards** (**Dashboards**).
{{< nav-icon "dashboards" >}}
@ -38,7 +38,7 @@ weight: 201
**To create a dashboard from a template in the dashboards page**:
1. Click the **Dashboards** icon in the navigation bar.
1. In the navigation menu on the left, select **Boards** (**Dashboards**).
{{< nav-icon "dashboards" >}}
@ -62,7 +62,7 @@ weight: 201
## Clone a dashboard
1. Click the **Dashboards** icon in the navigation bar.
1. In the navigation menu on the left, select **Boards** (**Dashboards**).
{{< nav-icon "dashboards" >}}
@ -79,7 +79,7 @@ weight: 201
You can also send data to your dashboard directly from the Data Explorer. For details, [Explore metrics](/v2.0/visualize-data/explore-metrics).
#### Add a note to your dashboard
1. From your dashboard, click **{{< icon "note" >}} Add Note** in the upper right.
1. From your dashboard, click **{{< icon "note" >}} Add Note** in the upper left.
2. Enter your note in the window that appears. You can use Markdown syntax to format your note.
3. To preview your Markdown formatting, click the **Preview** option.
4. Click **Save**.

View File

@ -11,7 +11,7 @@ weight: 204
To delete a dashboard from the InfluxDB user interface (UI):
1. Click the **Dashboards** icon in the navigation bar.
1. In the navigation menu on the left, select **Boards** (**Dashboards**).
{{< nav-icon "dashboards" >}}

View File

@ -15,7 +15,7 @@ InfluxDB lets you export dashboards from the InfluxDB user interface (UI).
## Export a dashboard
1. Click the **Dashboards** icon in the navigation bar.
1. In the navigation menu on the left, select **Boards** (**Dashboards**).
{{< nav-icon "dashboards" >}}

View File

@ -16,7 +16,7 @@ The InfluxDB user interface (UI) allows you to move seamlessly between using the
Flux builder or templates and manually editing the query.
Choose between [visualization types](/v2.0/visualize-data/visualization-types/) for your query.
To open the **Data Explorer**, click the **Data Explorer** icon in the navigation bar:
To open the **Data Explorer**, click the **Explore** (**Data Explorer**) icon in the left navigation menu:
{{< nav-icon "data-explorer" >}}
@ -26,7 +26,7 @@ Flux is InfluxData's functional data scripting language designed for querying,
analyzing, and acting on time series data.
See [Get started with Flux](/v2.0/query-data/get-started) to learn more about Flux.
1. Click the **Data Explorer** icon in the sidebar.
1. In the navigation menu on the left, select **Explore* (**Data Explorer**).
{{< nav-icon "data-explorer" >}}
@ -48,14 +48,10 @@ See [Get started with Flux](/v2.0/query-data/get-started) to learn more about Fl
Select from available [visualization types](/v2.0/visualize-data/visualization-types/) or enable the **View Raw Data** option to view all of your query's results.
1. Select a visualization type from the dropdown menu in the upper-left.
Select a visualization type from the dropdown menu in the upper-left.
{{< img-hd src="/img/2-0-visualization-dropdown.png" title="Visualization dropdown" />}}
2. Select the **Visualization** tab at the bottom of the **Data Explorer**.
For details about all of the available visualization options, see
[Visualization types](/v2.0/visualize-data/visualization-types/).
## Control your dashboard cell
To open the cell editor overlay, click the gear icon in the upper right of a cell and select **Configure**.
@ -65,7 +61,7 @@ To open the cell editor overlay, click the gear icon in the upper right of a cel
Toggle the **View Raw Data** {{< icon "toggle" >}} option to see your data in table format instead of a graph. Use this option when data can't be visualized using a visualization type.
{{< img-hd src="/img/2-0-controls-view-raw-data.png" alt="View raw data" />}}
{{< img-hd src="/img/beta-8-raw-data.png" alt="View raw data" />}}
### Save as CSV
@ -75,7 +71,7 @@ Click the CSV icon to save the cells contents as a CSV file.
Select how frequently to refresh the dashboard's data. By default, refreshing is paused.
{{< img-hd src="/img/2-0-controls-refresh-interval.png" alt="Select refresh interval" />}}
{{< img-hd src="/img/beta-8-interval-dropdown.png" alt="Select refresh interval" />}}
### Manually refresh dashboard

View File

@ -14,11 +14,10 @@ weight: 104
Labels are a way to add visual metadata to dashboards, tasks, and other items in the InfluxDB UI.
To manage labels:
1. Click the **Settings** icon in the navigation bar.
- In the navigation menu on the left, select **Settings** > **Labels**.
{{< nav-icon "settings" >}}
2. Click **Labels**.
#### Create a label
1. Click **{{< icon "plus" >}} Create Label**.

View File

@ -13,7 +13,7 @@ weight: 201
## Create a template from an existing dashboard
1. Click the **Dashboards** icon in the navigation bar.
1. In the navigation menu on the left, select **Boards** (**Dashboards**).
{{< nav-icon "dashboards" >}}
@ -28,11 +28,10 @@ weight: 201
Only [user templates](/v2.0/visualize-data/templates/#dashboard-template-types) can be cloned.
{{% /note %}}
1. Click the **Settings** icon in the left navigation.
1. In the navigation menu on the left, select **Settings** > **Templates**.
{{< nav-icon "settings" >}}
2. Select the **Templates** tab.
3. Select **User Templates**.
{{< img-hd src="/img/2-0-templates-type-select.png" alt="Select User Templates" />}}
@ -42,11 +41,10 @@ Only [user templates](/v2.0/visualize-data/templates/#dashboard-template-types)
## Import an existing dashboard template
1. Click the **Settings** icon in the left navigation.
1. In the navigation menu on the left, select **Settings** > **Templates**.
{{< nav-icon "settings" >}}
2. Select the **Templates** tab.
3. Click **Import Template** in the upper right.
4. In the window that appears:
* Select **Upload File** to drag-and-drop or select a file.

View File

@ -13,10 +13,9 @@ weight: 203
To delete a template in the InfluxDB UI:
1. Click the **Settings** icon in the left navigation.
1. In the navigation menu on the left, select **Settings** > **Templates**.
{{< nav-icon "settings" >}}
2. Select the **Templates** tab.
3. Hover over the name of the template you want to delete, then click **{{< icon "trash" >}}**.
3. Click **Delete** to delete your dashboard.

View File

@ -13,11 +13,10 @@ weight: 202
To create a new dashboard from an InfluxDB dashboard template:
1. Click the **Settings** icon in the left navigation.
1. In the navigation menu on the left, select **Settings** > **Templates**.
{{< nav-icon "settings" >}}
2. Select the **Templates** tab.
3. Select the [template type](/v2.0/visualize-data/templates/#dashboard-template-types).
{{< img-hd src="/img/2-0-templates-type-select.png" alt="Select User Templates" />}}

View File

@ -12,11 +12,10 @@ weight: 202
To view templates in the InfluxDB userface (UI):
1. Click the **Settings** icon in the left navigation.
1. In the navigation menu on the left, select **Settings** > **Templates**.
{{< nav-icon "settings" >}}
2. Select the **Templates** tab.
3. Select templates to view:
{{< img-hd src="/img/2-0-templates-type-select.png" alt="Select User Templates" />}}

View File

@ -13,7 +13,7 @@ menu:
The **Gauge** visualization displays the most recent value for a time series in a gauge.
{{< img-hd src="/img/2-0-visualizations-gauge-example.png" alt="Gauge example" />}}
{{< img-hd src="/img/2-0-visualizations-gauge-example-8.png" alt="Gauge example" />}}
Select the **Gauge** option from the visualization dropdown in the upper right.
@ -64,4 +64,4 @@ from(bucket: "example-bucket")
```
###### Visualization options for pressure gauge
{{< img-hd src="/img/2-0-visualizations-guage-pressure.png" alt="Pressure guage example" />}}
{{< img-hd src="/img/2-0-visualizations-gauge-pressure-8.png" alt="Pressure guage example" />}}

View File

@ -18,7 +18,7 @@ related:
The **Graph + Single Stat** view displays the specified time series in a line graph
and overlays the single most recent value as a large numeric value.
{{< img-hd src="/img/2-0-visualizations-line-graph-single-stat-example.png" alt="Line Graph + Single Stat example" />}}
{{< img-hd src="/img/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.
@ -92,5 +92,5 @@ from(bucket: "example-bucket")
r._field == "used_percent"
)
```
###### Memory usage visualization
{{< img-hd src="/img/2-0-visualizations-graph-single-stat-mem.png" alt="Graph + Single Stat Memory Usage Example" />}}
###### Memory allocations visualization
{{< img-hd src="/img/2-0-visualizations-graph-single-stat-mem-8.png" alt="Graph + Single Stat Memory Usage Example" />}}

View File

@ -14,7 +14,7 @@ menu:
The Graph visualization provides several types of graphs, each configured through
the [Graph controls](#graph-controls).
{{< img-hd src="/img/2-0-visualizations-line-graph-example.png" alt="Line Graph example" />}}
{{< img-hd src="/img/2-0-visualizations-line-graph-example-8.png" alt="Line Graph example" />}}
Select the **Graph** option from the visualization dropdown in the upper right.
@ -59,13 +59,13 @@ the visualization dropdown.
## Graph Examples
##### Graph with linear interpolation
{{< img-hd src="/img/2-0-visualizations-line-graph-example.png" alt="Line Graph example" />}}
{{< img-hd src="/img/2-0-visualizations-line-graph-example-8.png" alt="Line Graph example" />}}
##### Graph with smooth interpolation
{{< img-hd src="/img/2-0-visualizations-line-graph-smooth-example.png" alt="Step-Plot Graph example" />}}
{{< img-hd src="/img/2-0-visualizations-line-graph-smooth-example-8.png" alt="Step-Plot Graph example" />}}
##### Graph with step interpolation
{{< img-hd src="/img/2-0-visualizations-line-graph-step-example.png" alt="Step-Plot Graph example" />}}
{{< img-hd src="/img/2-0-visualizations-line-graph-step-example-8.png" alt="Step-Plot Graph example" />}}
<!-- ##### Stacked Graph example
{{< img-hd src="/img/2-0-visualizations-stacked-graph-example.png" alt="Stacked Graph example" />}} -->

View File

@ -13,7 +13,7 @@ menu:
The **Single Stat** view displays the most recent value of the specified time series as a numerical value.
{{< img-hd src="/img/2-0-visualizations-single-stat-example.png" alt="Single stat example" />}}
{{< img-hd src="/img/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.
@ -62,4 +62,4 @@ from(bucket: "example-bucket")
```
###### Memory usage as a single stat
{{< img-hd src="/img/2-0-visualizations-single-stat-memor.png" alt="Graph + Single Stat Memory Usage Example" />}}
{{< img-hd src="/img/2-0-visualizations-single-stat-example-8.png" alt="Graph + Single Stat Memory Usage Example" />}}

Binary file not shown.

After

Width:  |  Height:  |  Size: 68 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 241 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 144 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 162 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 156 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 167 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 68 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 65 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 86 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 180 KiB