diff --git a/assets/js/content-interactions.js b/assets/js/content-interactions.js
index 4e02a7125..e4e7d3c85 100644
--- a/assets/js/content-interactions.js
+++ b/assets/js/content-interactions.js
@@ -84,3 +84,10 @@ $(".truncate-toggle").click(function(e) {
e.preventDefault()
$(this).closest('.truncate').toggleClass('closed');
})
+
+//////////////////// Replace Missing Images with Placeholder ///////////////////
+
+$(".article--content img").on("error", function() {
+ $(this).attr("src", "/img/coming-soon.svg");
+ $(this).attr("style", "max-width:500px;");
+});
diff --git a/assets/styles/tools/_icomoon.scss b/assets/styles/tools/_icomoon.scss
index 9dc0c8631..6f20c90e3 100644
--- a/assets/styles/tools/_icomoon.scss
+++ b/assets/styles/tools/_icomoon.scss
@@ -1,10 +1,10 @@
@font-face {
font-family: 'icomoon';
- src: url('fonts/icomoon.eot?cn4x5l');
- src: url('fonts/icomoon.eot?cn4x5l#iefix') format('embedded-opentype'),
- url('fonts/icomoon.ttf?cn4x5l') format('truetype'),
- url('fonts/icomoon.woff?cn4x5l') format('woff'),
- url('fonts/icomoon.svg?cn4x5l#icomoon') format('svg');
+ src: url('fonts/icomoon.eot?rws1o3');
+ src: url('fonts/icomoon.eot?rws1o3#iefix') format('embedded-opentype'),
+ url('fonts/icomoon.ttf?rws1o3') format('truetype'),
+ url('fonts/icomoon.woff?rws1o3') format('woff'),
+ url('fonts/icomoon.svg?rws1o3#icomoon') format('svg');
font-weight: normal;
font-style: normal;
}
@@ -87,6 +87,12 @@
.icon-menu:before {
content: "\e91b";
}
+.icon-minus:before {
+ content: "\e91d";
+}
+.icon-plus:before {
+ content: "\e91e";
+}
.icon-settings:before {
content: "\e914";
}
diff --git a/content/v2.0/UI/exploring-metrics.md b/content/v2.0/UI/exploring-metrics.md
deleted file mode 100644
index eaeae8a34..000000000
--- a/content/v2.0/UI/exploring-metrics.md
+++ /dev/null
@@ -1,41 +0,0 @@
----
-title: Exploring metrics
-description:
-menu:
- v2_0:
- name: Exploring metrics
- weight: 1
- parent: Placeholder parent
----
-
-Explore and visualize your data in the **Data Explorer**. The user interface allows you to move seamlessly between using the builder or templates and manually editing the query; when possible, the interface automatically populates the builder with the information from your raw query. Choose between [visualization types](/chronograf/latest/guides/visualization-types/) for your query.
-
-To open the **Data Explorer**, click the **Explore** icon in the navigation bar:
-
-
-
-## Explore data with Flux
-
-Flux is InfluxData's new functional data scripting language designed for querying, analyzing, and acting on time series data. To learn more about Flux, see [Getting started with Flux](/flux/v0.7/introduction/getting-started).
-
-1. Click the **Data Explorer** icon in the sidebar.
-2. Use the builder to select from your existing data and have the query automatically formatted for you.
-Alternatively, click **Edit Query As Flux** to manually edit the query. To switch back to the query builder, click **Visual Query Builder**.
-3. Use the **Functions** pane to review the available Flux functions. Click on a function from the list to add it to your query.
-4. Click **Submit** to run your query. You can then preview your graph in the above pane.
-
-## Visualize your query
-
-**To visualize your query**:
-
-* Select a visualization type from the dropdown menu in the upper-left.
-<>
-* Select the **Visualization** tab at the bottom of the **Data Explorer**. For details about all of the available visualization options, see [Visualization types](/chronograf/latest/guides/visualization-types/).
-
-## Save your query as a dashboard cell or task
-
-**To save your query**:
-
-1. Click **Save as** in the upper right.
-2. Click **Dashboard Cell** to add your query to a dashboard.
-3. Click **Task** to save your query as a task.
diff --git a/content/v2.0/process-data/_index.md b/content/v2.0/process-data/_index.md
index 0ba0c738c..4a0647a88 100644
--- a/content/v2.0/process-data/_index.md
+++ b/content/v2.0/process-data/_index.md
@@ -7,7 +7,7 @@ description: >
menu:
v2_0:
name: Process data
- weight: 3
+ weight: 5
---
InfluxDB's _**task engine**_ is designed for processing and analyzing data.
diff --git a/content/v2.0/reference/flux/functions/transformations/fill.md b/content/v2.0/reference/flux/functions/transformations/fill.md
index 372fd3d19..7d5ca6826 100644
--- a/content/v2.0/reference/flux/functions/transformations/fill.md
+++ b/content/v2.0/reference/flux/functions/transformations/fill.md
@@ -8,7 +8,7 @@ menu:
weight: 1
---
-The `fill()` function replaces all null values in an input stream and replace them with a non-null value.
+The `fill()` function replaces all null values in an input stream with a non-null value.
The output stream is the same as the input stream with all null values replaced in the specified column.
_**Function type:** Transformation_
diff --git a/content/v2.0/ui/labels.md b/content/v2.0/ui/labels.md
deleted file mode 100644
index f75f73d73..000000000
--- a/content/v2.0/ui/labels.md
+++ /dev/null
@@ -1,15 +0,0 @@
----
-title: Managing labels
-description: This is just an example post to show the format of new 2.0 posts
-menu:
- v2_0:
- name: Managing labels
- weight: 1
- parent: Placeholder parent
----
-Labels are !!!.
-
-**To view labels**:
-
-* Click the **Configuration** icon in the navigation bar.
-* Review the list of labels or enter a search to filter the list of labels.
diff --git a/content/v2.0/visualize-data/_index.md b/content/v2.0/visualize-data/_index.md
new file mode 100644
index 000000000..4cbd56e4b
--- /dev/null
+++ b/content/v2.0/visualize-data/_index.md
@@ -0,0 +1,15 @@
+---
+title: Visualize data with InfluxDB
+description: >
+ InfluxDB offers a complete dashboard solution for visualizing your time series data.
+ Create custom dashboards with flexible queries and visualization types.
+menu:
+ v2_0:
+ name: Visualize data
+ weight: 4
+---
+
+The InfluxDB user interface provides tools for building custom dashboards to visualize your data.
+The following articles outline ways to customize and manage dashboards.
+
+{{< children >}}
diff --git a/content/v2.0/UI/dashboards.md b/content/v2.0/visualize-data/dashboards.md
similarity index 59%
rename from content/v2.0/UI/dashboards.md
rename to content/v2.0/visualize-data/dashboards.md
index 883cd9068..ca5f0ded6 100644
--- a/content/v2.0/UI/dashboards.md
+++ b/content/v2.0/visualize-data/dashboards.md
@@ -1,15 +1,17 @@
---
-title: Managing dashboards
-description: This is just an example post to show the format of new 2.0 posts
+title: Manage InfluxDB dashboards
+description: Create, edit, and manage custom dashboards in the InfluxDB user interface (UI).
menu:
v2_0:
- name: Managing dashboards
+ name: Manage dashboards
+ parent: Visualize data
weight: 1
- parent: Placeholder parent
---
Create, edit, and manage dashboards from the **Dashboards** tab in the left navigation.
+{{< img-hd src="/img/dashboards-icon.png" title="Dashboard icon" />}}
+
Variable names changed--instead of dashboard time, it's time range start/time range end (double-check).
Window interval replaces interval
Save as somewhere--same as send to dashboard
@@ -17,7 +19,7 @@ Also save as dashboard/save as tasks
Multiple tabs, hide/show tabs, rename tabs
-## Creating dashboards
+## Create a dashboard
**To create a dashboard**:
@@ -25,32 +27,33 @@ Multiple tabs, hide/show tabs, rename tabs
2. Click the **+Create Dashboard** button in the upper right.
3. Enter a name for your dashboard in the **Name this dashboard** field in the upper left.
-**To add data to your dashboard**:
+#### Add data to your dashboard
1. From your dashboard, click **Add Cell** in the upper right. The Data Explorer overlay opens.
-2. Create a query in the Data Explorer following the instructions in <>.
+2. Create a query in the Data Explorer following the instructions in [Exlpore metrics](/v2.0/visualize-data/explore-metrics).
3. Enter a name for your cell in the upper left.
4. Click the checkmark icon to save the cell to your dashboard.
You can also send data to your dashboard directly from the Data Explorer. For details, see <>.
-**To add a note to your dashboard**:
+#### Add a note to your dashboard
1. From your dashboard, click **Add Note** in the upper right.
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**.
-## Modifying dashboards
+## Modify a dashboard
- **To delete a dashboard**:
- 1. Hover over the dashboard name in the list of dashboards to show options.
- 2. Click **Delete**.
- <>
- 3. Click **Confirm** to continue deleting your dashboard.
+#### Delete a dashboard
+1. Hover over the dashboard name in the list of dashboards to show options.
+2. Click **Delete**.
+3. Click **Confirm** to continue deleting your dashboard.
-**To clone a dashboard**:
-* Hover over the dashbaord name in the list of dashboard to show options.
-* Click **Clone**.
-<>
- The cloned dashboard opens.
+ 
+
+#### Clone a dashboard
+1. Hover over the dashbaord name in the list of dashboard to show options.
+2. Click **Clone**. The cloned dashboard opens.
+
+ 
diff --git a/content/v2.0/visualize-data/explore-metrics.md b/content/v2.0/visualize-data/explore-metrics.md
new file mode 100644
index 000000000..1afe78de8
--- /dev/null
+++ b/content/v2.0/visualize-data/explore-metrics.md
@@ -0,0 +1,54 @@
+---
+title: Explore metrics with InfluxDB
+description: >
+ Explore and visualize your data in InfluxDB's Data Explorer.
+ The InfluxDB user interface (UI) allows you to move seamlessly between using the
+ Flux builder and manually editing the query.
+menu:
+ v2_0:
+ name: Explore metrics
+ parent: Visualize data
+ weight: 1
+---
+
+Explore and visualize your data in the **Data Explorer**.
+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:
+
+{{< img-hd src="/img/data-explorer-icon.png" title="Data Explorer icon" />}}
+
+## Explore data with Flux
+
+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.
+2. Use the Flux builder in the bottom panel to select a bucket and filters such as measurement, field or tag.
+ Alternatively, click **Switch to Script Editor** to manually edit the query.
+ To switch back to the query builder, click **Switch to Query Builder**.
+3. Use the **Functions** list to review the available Flux functions.
+ Click on a function from the list to add it to your query.
+4. Click **Submit** to run your query. You can then preview your graph in the above pane.
+
+## Visualize your query
+To visualize your query:
+
+1. Select a visualization type from the dropdown menu in the upper-left.
+
+ {{< img-hd src="/img/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/).
+
+## Save your query as a dashboard cell or task
+
+**To save your query**:
+
+1. Click **Save as** in the upper right.
+2. Click **Dashboard Cell** to add your query to a dashboard.
+3. Click **Task** to save your query as a task.
diff --git a/content/v2.0/visualize-data/labels.md b/content/v2.0/visualize-data/labels.md
new file mode 100644
index 000000000..1ef843a91
--- /dev/null
+++ b/content/v2.0/visualize-data/labels.md
@@ -0,0 +1,43 @@
+---
+title: Manage labels in the InfluxDB UI
+description: >
+ Labels are a way to add visual metadata to dashboards, tasks, and other items
+ in the InfluxDB UI. View and manage labels in the InfluxDB user interface.
+menu:
+ v2_0:
+ name: Manage labels
+ parent: Visualize data
+ weight: 1
+---
+
+Labels are a way to add visual metadata to dashboards, tasks, and other items in the InfluxDB UI.
+To manage labels, click the **Configuration** icon in the navigation bar and select **Labels**.
+
+{{< img-hd src="/img/labels-nav-link.png" title="Labels configuration" />}}
+
+#### Create a label
+1. Click **+ Create Label**.
+2. Enter a **Name** for the label.
+3. Select a **Color** for the lable.
+4. Enter a description for the label _(Optional)_.
+5. Click **Create label**.
+
+#### Edit a label
+1. In the label list view, click the name of the label you would like to edit.
+ The **Edit Label** overlay will appear.
+2. Make the desired changes to the label.
+3. Click **Save Changes**.
+
+#### Delete a label
+1. In the label list view, hover over the label you would like to delete.
+2. Click **Delete** in the far right of the label row.
+
+### Add labels to dashboards and tasks
+1. In the list view of dashboards or tasks, hover over the item to which you would like to add a label.
+2. Click the
+
+ icon that appears to the right of the name.
+ The **Manage Labels** overlay will appear.
+3. Type the name of the label you would like to add to filter the list of available labels.
+ Click the label you would like to add. More than one label can be added.
+4. Click **Save Changes**.
diff --git a/content/v2.0/UI/sources.md b/content/v2.0/visualize-data/sources.md
similarity index 95%
rename from content/v2.0/UI/sources.md
rename to content/v2.0/visualize-data/sources.md
index b2c483c8f..ad2bf09bf 100644
--- a/content/v2.0/UI/sources.md
+++ b/content/v2.0/visualize-data/sources.md
@@ -1,15 +1,15 @@
---
-title: Managing sources
-description: This is just an example post to show the format of new 2.0 posts
+title: Manage sources
+description: InfluxDB offers a complete dashboard solution for visualizing your data and monitoring your infrastructure.
menu:
v2_0:
- name: Managing sources
+ name: Manage sources
+ parent: Visualize data
weight: 1
- parent: Placeholder parent
---
-Chronograf offers a complete dashboard solution for visualizing your data and monitoring your infrastructure:
+InfluxDB offers a complete dashboard solution for visualizing your data and monitoring your infrastructure:
* View [pre-created dashboards](/chronograf/latest/guides/using-precreated-dashboards) from the Host List page. Dashboards are available depending on which Telegraf input plugins you have enabled. These pre-created dashboards cannot be cloned or edited.
* Create custom dashboards from scratch by building queries in the Data Explorer, as described [below](#build-a-dashboard).
diff --git a/content/v2.0/UI/visualization-types.md b/content/v2.0/visualize-data/visualization-types.md
similarity index 80%
rename from content/v2.0/UI/visualization-types.md
rename to content/v2.0/visualize-data/visualization-types.md
index 495c7e06f..73a0a8c36 100644
--- a/content/v2.0/UI/visualization-types.md
+++ b/content/v2.0/visualize-data/visualization-types.md
@@ -1,15 +1,20 @@
---
title: Visualization types
-description: This is just an example post to show the format of new 2.0 posts
+description: >
+ InfluxDB dashboards support mulitple visualization types including line graphs,
+ gauges, tables, and more.
menu:
v2_0:
name: Visualization types
+ parent: Visualize data
weight: 1
- parent: Placeholder parent
---
-Chronograf's dashboard views support the following visualization types, which can be selected in the **Visualization Type** selection view of the <>.
-[Visualization Type selector](/img/chronograf/chrono-viz-types-selector.png)
+The InfluxDB's user interface's (UI) dashboard views support the following visualization types,
+which can be selected in the **Visualization Type** selection view of the
+[Data Explorer](/v2.0/visualize-data/explore-metrices).
+
+[Visualization Type selector](/img/chrono-viz-types-selector.png)
Each of the available visualization types and available user controls are described below.
@@ -22,7 +27,7 @@ Each of the available visualization types and available user controls are descri
* [Gauge](#gauge)
* [Table](#table)
-For information on adding and displaying annotations in graph views, see [Adding annotations to Chronograf views](/chronograf/v1.7/guides/annotations/).
+For information on adding and displaying annotations in graph views, see [Adding annotations to Chronograf views](/v1.7/guides/annotations/).
### Graphs
@@ -32,11 +37,11 @@ There are several types of graphs you can create.
The **Line Graph** view displays a time series in a line graph.
-
+
##### Line Graph Controls
-
+
Use the **Line Graph Controls** to specify the following:
@@ -55,18 +60,18 @@ Use the **Line Graph Controls** to specify the following:
##### Line Graph example
-
+
#### Stacked Graph
The **Stacked Graph** view displays multiple time series bars as segments stacked on top of each other.
-
+
##### Stacked Graph Controls
-
+
Use the **Stacked Graph Controls** to specify the following:
@@ -85,18 +90,18 @@ Use the **Stacked Graph Controls** to specify the following:
##### Stacked Graph example
-
+
### Step Graph
The **Step-Plot Graph** view displays a time series in a staircase graph.
-
+
#### Step Graph Controls
-
+
Use the **Step-Plot Graph Controls** to specify the following:
@@ -113,7 +118,7 @@ Use the **Step-Plot Graph Controls** to specify the following:
#### Step-Plot Graph example
-
+
### Bar Graph
@@ -122,11 +127,11 @@ The **Bar Graph** view displays the specified time series using a bar chart.
To select this view, click the Bar Graph selector icon.
-
+
#### Bar Graph Controls
-
+
Use the **Bar Graph Controls** to specify the following:
@@ -143,7 +148,7 @@ Use the **Bar Graph Controls** to specify the following:
#### Bar Graph example
-
+
### Line Graph + Single Stat
@@ -152,11 +157,11 @@ The **Line Graph + Single Stat** view displays the specified time series in a li
To select this view, click the **Line Graph + Single Stat** view option.
-
+
#### Line Graph + Single Stat Controls
-
+
Use the **Line Graph + Single Stat Controls** to specify the following:
@@ -173,13 +178,13 @@ Use the **Line Graph + Single Stat Controls** to specify the following:
#### Line Graph + Single Stat example
-
+
### Single Stat
The **Single Stat** view displays the most recent value of the specified time series as a numerical value.
-
+
If a cell's query includes a [`GROUP BY` tag](/influxdb/latest/query_language/data_exploration/#group-by-tags) clause, Chronograf sorts the different [series](/influxdb/latest/concepts/glossary/#series) lexicographically and shows the most recent [field value](/influxdb/latest/concepts/glossary/#field-value) associated with the first series.
For example, if a query groups by the `name` [tag key](/influxdb/latest/concepts/glossary/#tag-key) and `name` has two [tag values](/influxdb/latest/concepts/glossary/#tag-value) (`chronelda` and `chronz`), Chronograf shows the most recent field value associated with the `chronelda` series.
@@ -205,11 +210,11 @@ The **Gauge** view displays the single value most recent value for a time series
To select this view, click the Gauge selector icon.
-
+
#### Gauge Controls
-
+
Use the **Gauge Controls** to specify the following:
@@ -223,17 +228,17 @@ Use the **Gauge Controls** to specify the following:
#### Gauge example
-
+
### Table
The **Table** panel displays the results of queries in a tabular view, which is sometimes easier to analyze than graph views of data.
-
+
#### Table Controls
-
+
Use the **Table Controls** to specify the following:
@@ -259,4 +264,4 @@ Threshold settings apply to any cells with values, except when they appear in th
#### Table view example
-
+
diff --git a/static/fonts/icomoon.eot b/static/fonts/icomoon.eot
index 18e383421..9add80a76 100755
Binary files a/static/fonts/icomoon.eot and b/static/fonts/icomoon.eot differ
diff --git a/static/fonts/icomoon.svg b/static/fonts/icomoon.svg
index 695661357..1deca15a0 100755
--- a/static/fonts/icomoon.svg
+++ b/static/fonts/icomoon.svg
@@ -36,6 +36,8 @@
+
+
diff --git a/static/fonts/icomoon.ttf b/static/fonts/icomoon.ttf
index ab5d0d5f4..d590167c0 100755
Binary files a/static/fonts/icomoon.ttf and b/static/fonts/icomoon.ttf differ
diff --git a/static/fonts/icomoon.woff b/static/fonts/icomoon.woff
index 0990bc118..465c4be0a 100755
Binary files a/static/fonts/icomoon.woff and b/static/fonts/icomoon.woff differ
diff --git a/static/img/coming-soon.svg b/static/img/coming-soon.svg
new file mode 100644
index 000000000..633405792
--- /dev/null
+++ b/static/img/coming-soon.svg
@@ -0,0 +1,71 @@
+
+
+
diff --git a/static/img/dashboard-clone.png b/static/img/dashboard-clone.png
new file mode 100644
index 000000000..d35c1d4de
Binary files /dev/null and b/static/img/dashboard-clone.png differ
diff --git a/static/img/dashboard-delete.png b/static/img/dashboard-delete.png
new file mode 100644
index 000000000..0e53b77b3
Binary files /dev/null and b/static/img/dashboard-delete.png differ
diff --git a/static/img/dashboards-icon.png b/static/img/dashboards-icon.png
new file mode 100644
index 000000000..2c65c7c50
Binary files /dev/null and b/static/img/dashboards-icon.png differ
diff --git a/static/img/data-explorer-icon.png b/static/img/data-explorer-icon.png
new file mode 100644
index 000000000..8da32b1b1
Binary files /dev/null and b/static/img/data-explorer-icon.png differ
diff --git a/static/img/labels-nav-link.png b/static/img/labels-nav-link.png
new file mode 100644
index 000000000..c0020b1b0
Binary files /dev/null and b/static/img/labels-nav-link.png differ
diff --git a/static/img/visualization-dropdown.png b/static/img/visualization-dropdown.png
new file mode 100644
index 000000000..8cf5bea0b
Binary files /dev/null and b/static/img/visualization-dropdown.png differ