docs-v2/content/v2.0/UI/sources.md

120 lines
6.2 KiB
Markdown

---
title: Managing sources
description: This is just an example post to show the format of new 2.0 posts
menu:
v2_0:
name: Managing sources
weight: 1
---
Chronograf 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).
* Import dashboard templates when you add or update a connection in Chronograf. See [Dashboard templates](#dashboard-templates) for details.
By the end of this guide, you'll be aware of the tools available to you for creating dashboards similar to this example:
![Oh, the Chronobilities](/img/chronograf/v1.7/g-dashboard-possibilities.png)
## Requirements
To perform the tasks in this guide, you must have a working Chronograf instance that is connected to an InfluxDB source.
Data is accessed using the Telegraf [system ](https://github.com/influxdata/telegraf/tree/master/plugins/inputs/system) input plugins.
For more information, see [Configuring Chronograf](/chronograf/latest/administration/configuration).
## Build a Dashboard
Click **Dashboards** in the navigation bar and then click the **Create Dashboard** button.
A new dashboard is created and ready to begin adding cells.
### Step 1: Name your dashboard
Click **Name This Dashboard** and type a new name. In this guide, "ChronoDash" is used.
### Step 2: Enter cell editor mode
In the first cell, titled "Untitled Cell", click **Edit**
to open the cell editor mode.
![Edit your cell](/img/chronograf/g-dashboard-cell-edit.png)
### Step 3: Create your query
Click the **Add a Query** button to create an [InfluxQL](/influxdb/latest/query_language/) query.
In query editor mode, use the builder to select from your existing data and allow Chronograf to format the query for you.
Alternatively, manually enter and edit a query.
Chronograf allows you to move seamlessly between using the builder and manually editing the query; when possible, the interface automatically populates the builder with the information from your raw query.
For our example, the query builder is used to generate a query that shows the average idle CPU usage grouped by host (in this case, there are three hosts).
By default, Chronograf applies the [`MEAN()` function](/influxdb/latest/query_language/functions/#mean) to the data, groups averages into auto-generated time intervals (`:interval:`), and shows data for the past hour (`:dashboardTime:`).
Those defaults are configurable using the query builder or by manually editing the query.
In addition, the time range (`:dashboardTime:`) is [configurable on the dashboard](#step-6-configure-your-dashboard).
![Build your query](/img/chronograf/v1.7/g-dashboard-builder.png)
### Step 4: Choose your visualization type
Chronograf supports many different [visualization types](/chronograf/latest/guides/visualization-types/). To choose a visualization type, click **Visualization** and select **Step-Plot Graph**.
![Visualization type](/img/chronograf/v1.7/g-dashboard-visualization.png)
### Step 5: Save your cell
Click **Save** (the green checkmark icon) to save your cell.
> ***Note:*** if you navigate away from this page without clicking Save, your work will not be saved.
### Step 6: Configure your dashboard
#### Customize cells:
* You can change the name of the cell from "Untitled Cell" by returning to the cell editor mode, clicking on the name, and renaming it. Remember to save your changes.
* **Move** your cell around by clicking its top bar and dragging it around the page
* **Resize** your cell by clicking and dragging its bottom right corner
#### Explore cell data:
* **Zoom** in on your cell by clicking and dragging your mouse over the area of interest
* **Pan** over your cell data by pressing the shift key and clicking and dragging your mouse over the graph
* **Reset** your cell by double-clicking your mouse in the cell window
> Note:
These tips only apply to the line, stacked, step-plot, and line+stat [visualization types](/chronograf/latest/guides/visualization-types/).
#### Configure dashboard-wide settings:
* You can change the dashboard's *auto-refresh interval* at the top of the page - the default interval selected is **Every 15 seconds**.
* You can also modify the dashboard's *time range* at the top of the page - the default range is **Past 15 minutes**.
Now, you are free to experiment and complete your dashboard by creating, editing, and repositioning more cells!
## Dashboard templates
Select from a variety of dashboard templates to import and customize based on which Telegraf plugins you have enabled, such as the following examples:
* <img src="/img/chronograf/v1.7/protoboard-kubernetes.png" style="width:100%; max-width:600px;">
* <img src="/img/chronograf/v1.7/protoboard-mysql.png" style="width:100%; max-width:600px;">
* <img src="/img/chronograf/v1.7/protoboard-system.png" style="width:100%; max-width:600px;">
* <img src="/img/chronograf/v1.7/protoboard-vsphere.png" style="width:100%; max-width:600px;">
**To import dashboard templates:**
1. From the Configuration page, click **Add Connection** or select an existing connection to edit it.
2. In the **InfluxDB Connection** window, enter or verify your connection details and click **Add** or **Update Connection**.
3. In the **Dashboards** window, select from the available dashboard templates to import based on which Telegraf plugins you have enabled.
<img src="/img/chronograf/v1.7/protoboard-select.png" style="width:100%; max-width:500px;">
4. Click **Create (x) Dashboards**.
5. Edit, clone, or configure the dashboards as needed.
## Extra Tips
### Full screen mode
View your dashboard in full screen mode by clicking on the full screen icon in the top right corner of your dashboard.
To exit full screen mode, press the Esc key.
### Template variables
Dashboards support template variables.
See the [Dashboard Template Variables](/chronograf/latest/guides/dashboard-template-variables/) guide for more information.