Docs/panel refactor (#43569)

* new refactored panel docs

* fixed links

* removed xtra sharing link, added links to panel display option tasks

* fixed typo

* add aliases

* incorporate PM feedback

* intermediate commit to resolve merge conflict

* final changes to resolve merge conflicts
This commit is contained in:
Christopher Moyer 2022-01-18 15:06:27 -06:00 committed by GitHub
parent 959723050f
commit 449c608ef1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
118 changed files with 2043 additions and 1668 deletions

View File

@ -20,7 +20,7 @@ Grafana allows you to create alerting rules that query one or more data sources,
1. In Step 2, add queries and expressions to evaluate.
- Keep the default name or hover over and click the edit icon to change the name.
- For queries, select a data source from the drop-down.
- Add one or more [queries]({{< relref "../../../panels/queries.md" >}}) or [expressions]({{< relref "../../../panels/expressions.md" >}}).
- Add one or more [queries]({{< relref "../../../panels/query-a-data-source/add-a-query.md" >}}) or [expressions]({{< relref "../../../panels/query-a-data-source/use-expressions-to-manipulate-data/about-expressions.md" >}}).
- For each expression, select either **Classic condition** to create a single alert rule, or choose from **Math**, **Reduce**, **Resample** options to generate separate alert for each series. For details on these options, see [Single and multi dimensional rule](#single-and-multi-dimensional-rule).
- Click **Run queries** to verify that the query is successful.
1. In Step 3, add conditions.
@ -57,7 +57,7 @@ To generate a separate alert for each series, create a multi-dimensional rule. U
#### Rule with classic condition
For more information, see [expressions documentation]({{< relref "../../../panels/expressions.md" >}}).
For more information, see [expressions documentation]({{< relref "../../../panels/query-a-data-source/use-expressions-to-manipulate-data/about-expressions.md" >}}).
### No data and error handling

View File

@ -49,6 +49,6 @@ Once you have a strategy or design guidelines, write them down to help maintain
- Use the left and right Y-axes when displaying time series with different units or ranges.
- Add documentation to dashboards and panels.
- To add documentation to a dashboard, add a [Text panel visualization]({{< relref "../visualizations/text-panel.md" >}}) to the dashboard. Record things like the purpose of the dashboard, useful resource links, and any instructions users might need to interact with the dashboard. Check out this [Wikimedia example](https://grafana.wikimedia.org/d/000000066/resourceloader?orgId=1).
- To add documentation to a panel, [edit the panel settings]({{< relref "../panels/add-a-panel.md#edit-panel-settings" >}}) and add a description. Any text you add will appear if you hover your cursor over the small `i` in the top left corner of the panel.
- To add documentation to a panel, [edit the panel settings]({{< relref "../panels/working-with-panels/add-panel.md" >}}) and add a description. Any text you add will appear if you hover your cursor over the small `i` in the top left corner of the panel.
- Reuse your dashboards and enforce consistency by using [templates and variables]({{< relref "../variables/_index.md" >}}).
- Be careful with stacking graph data. The visualizations can be misleading, and hide important data. We recommend turning it off in most cases.

View File

@ -46,7 +46,7 @@ How can you tell you are here?
- Compare like to like: split service dashboards when the magnitude differs. Make sure aggregated metrics don't drown out important information.
- Expressive charts with meaningful use of color and normalizing axes where you can.
- Example of meaningful color: Blue means it's good, red means it's bad. [Thresholds]({{< relref "../panels/thresholds.md" >}}) can help with that.
- Example of meaningful color: Blue means it's good, red means it's bad. [Thresholds]({{< relref "../panels/specify-thresholds/about-thresholds.md" >}}) can help with that.
- Example of normalizing axes: When comparing CPU usage, measure by percentage rather than raw number, because machines can have a different number of cores. Normalizing CPU usage by the number of cores reduces cognitive load because the viewer can trust that at 100% all cores are being used, without having to know the number of CPUs.
- Directed browsing cuts down on "guessing."
- Template variables make it harder to “just browse” randomly or aimlessly.

View File

@ -110,7 +110,7 @@ For more advanced time settings, click the **Dashboard settings** (gear) icon at
## Panel time overrides and timeshift
In [Query options]({{< relref "../panels/queries.md#query-options" >}}), you can override the relative time range for individual panels, causing them to be different than what is selected in the dashboard time picker in the upper right. This allows you to show metrics from different time periods or days at the same time.
In [Query options]({{< relref "../panels/reference-query-options.md" >}}), you can override the relative time range for individual panels, causing them to be different than what is selected in the dashboard time picker in the upper right. This allows you to show metrics from different time periods or days at the same time.
> **Note:** Panel time overrides have no effect when the time range for the dashboard is absolute.

View File

@ -74,4 +74,4 @@ from(bucket: "grafana")
|> yield(name: "mean")
```
You can view the interpolated version of a query with the query inspector. For more information, refer to [Inspect a panel]({{< relref "../../panels/inspect-panel.md" >}}) and [Queries]({{< relref "../../panels/queries.md" >}}).
You can view the interpolated version of a query with the query inspector. For more information, refer to [Navigate the Query Inspector]({{< relref "../../panels/working-with-panels/navigate-inspector-panel.md" >}}).

View File

@ -174,7 +174,7 @@ A time series query result is returned in a [wide data frame format]({{< relref
> For backward compatibility, there's an exception to the above rule for queries that return three columns including a string column named metric. Instead of transforming the metric column into field labels, it becomes the field name, and then the series name is formatted as the value of the metric column. See the example with the metric column below.
You can optionally customize the default series name formatting using instructions in [Standard field options/Display name]({{< relref "../panels/standard-options.md#display-name" >}}).
You can optionally customize the default series name formatting using instructions in [Reference: Standard field definitions]({{< relref "../panels/reference-standard-field-definitions.md#display-name" >}}).
**Example with `metric` column:**
@ -218,7 +218,7 @@ GROUP BY
ORDER BY 1
```
Given the data frame result in the following example and using the graph panel, you will get two series named _value 10.0.1.1_ and _value 10.0.1.2_. To render the series with a name of _10.0.1.1_ and _10.0.1.2_ , use a [Standard field options/Display name]({{< relref "../panels/standard-options.md#display-name" >}}) value of `${__field.labels.hostname}`.
Given the data frame result in the following example and using the graph panel, you will get two series named _value 10.0.1.1_ and _value 10.0.1.2_. To render the series with a name of _10.0.1.1_ and _10.0.1.2_ , use a [Reference: Standard field definitions]({{< relref "../panels/reference-standard-field-definitions.md#display-name" >}}) display name value of `${__field.labels.hostname}`.
Data frame result:

View File

@ -186,7 +186,7 @@ A time series query result is returned in a [wide data frame format]({{< relref
> For backward compatibility, there's an exception to the above rule for queries that return three columns including a string column named metric. Instead of transforming the metric column into field labels, it becomes the field name, and then the series name is formatted as the value of the metric column. See the example with the metric column below.
You can optionally customize the default series name formatting using instructions in [Standard field options/Display name]({{< relref "../panels/standard-options.md#display-name" >}}).
You can optionally customize the default series name formatting using instructions in [Reference: Standard field definitions]({{< relref "../panels/reference-standard-field-definitions.md#display-name" >}}).
**Example with `metric` column:**
@ -228,7 +228,7 @@ GROUP BY time, hostname
ORDER BY time
```
Given the data frame result in the following example and using the graph panel, you will get two series named _value 10.0.1.1_ and _value 10.0.1.2_. To render the series with a name of _10.0.1.1_ and _10.0.1.2_ , use a [Standard field options/Display name]({{< relref "../panels/standard-options.md#display-name" >}}) value of `${__field.labels.hostname}`.
Given the data frame result in the following example and using the graph panel, you will get two series named _value 10.0.1.1_ and _value 10.0.1.2_. To render the series with a name of _10.0.1.1_ and _10.0.1.2_ , use a [Reference: Standard field definitions]({{< relref "../panels/reference-standard-field-definitions.md#display-name" >}}) display value of `${__field.labels.hostname}`.
Data frame result:

View File

@ -191,7 +191,7 @@ A time series query result is returned in a [wide data frame format]({{< relref
> For backward compatibility, there's an exception to the above rule for queries that return three columns including a string column named metric. Instead of transforming the metric column into field labels, it becomes the field name, and then the series name is formatted as the value of the metric column. See the example with the metric column below.
You can optionally customize the default series name formatting using instructions in [Standard field options/Display name]({{< relref "../panels/standard-options.md#display-name" >}}).
You can optionally customize the default series name formatting using instructions in [Reference: Standard field definitions]({{< relref "../panels/reference-standard-field-definitions.md#display-name" >}}).
**Example with `metric` column:**
@ -233,7 +233,7 @@ GROUP BY time, hostname
ORDER BY time
```
Given the data frame result in the following example and using the graph panel, you will get two series named _value 10.0.1.1_ and _value 10.0.1.2_. To render the series with a name of _10.0.1.1_ and _10.0.1.2_ , use a [Standard field options/Display name]({{< relref "../panels/standard-options.md#display-name" >}}) value of `${__field.labels.hostname}`.
Given the data frame result in the following example and using the graph panel, you will get two series named _value 10.0.1.1_ and _value 10.0.1.2_. To render the series with a name of _10.0.1.1_ and _10.0.1.2_ , use a [Reference: Standard field definitions]({{< relref "../panels/reference-standard-field-definitions.md#display-name" >}}) display value of `${__field.labels.hostname}`.
Data frame result:

View File

@ -163,7 +163,7 @@ Dimensions: 5 fields by 2 rows
+---------------------+------------------+------------------+------------------+------------------+
```
> **Note:** Not all panels support the wide time series data frame format. To keep full backward compatibility we have introduced a transformation that can be used to convert from the wide to the long format. Read more about how to use it here: [Prepare time series-transformation]({{< relref "../../panels/transformations/types-options.md#prepare-time-series" >}}).
> **Note:** Not all panels support the wide time series data frame format. To keep full backward compatibility we have introduced a transformation that can be used to convert from the wide to the long format. Read more about how to use it here: [Prepare time series-transformation]({{< relref "../../panels/reference-transformation-functions.md#prepare-time-series" >}}).
## Technical references

View File

@ -17,9 +17,9 @@ The following cache backends are available: in-memory, Redis, and Memcached.
When a panel queries a cached data source, the time until this query fetches fresh data is determined by the panel's **interval.** This means that wider panels and dashboards with shorter time ranges fetch new data more frequently than narrower panels and dashboards with longer time ranges.
Interval is visible in a panel's [query options]({{< relref "../panels/queries.md#query-options" >}}). It is calculated like this: `(max data points) / time range`. Max data points are calculated based on the width of the panel. For example, a full-width panel on a dashboard with a time range of `last 7 days` will retrieve fresh data every 10 minutes. In this example, cached data for this panel will be served for up to 10 minutes before Grafana queries the data source again and returns new data.
Interval is visible in a panel's [query options]({{< relref "../panels/reference-query-options.md" >}}). It is calculated like this: `(max data points) / time range`. Max data points are calculated based on the width of the panel. For example, a full-width panel on a dashboard with a time range of `last 7 days` will retrieve fresh data every 10 minutes. In this example, cached data for this panel will be served for up to 10 minutes before Grafana queries the data source again and returns new data.
You can make a panel retrieve fresh data more frequently by increasing the **Max data points** setting in the panel's [query options]({{< relref "../panels/queries.md#query-options" >}}).
You can make a panel retrieve fresh data more frequently by increasing the **Max data points** setting in the panel's [query options]({{< relref "../panels/reference-query-options.md" >}}).
## Query caching benefits

View File

@ -61,7 +61,7 @@ You can configure report-specific template variables for the dashboard on the re
> **Note:** Available in Grafana Enterprise v8+.
You can include dynamic dashboards with panels or rows, set to repeat by a variable, into reports. For detailed information about setting up repeating panels or rows in dashboards, refer to the [Repeat panels or rows]({{< relref "../panels/repeat-panels-or-rows.md" >}}) section.
You can include dynamic dashboards with panels or rows, set to repeat by a variable, into reports. For detailed information about setting up repeating panels or rows in dashboards, refer to the [Repeat panels or rows]({{< relref "../panels/add-panels-dynamically/" >}}) section.
#### Caveats:

View File

@ -7,8 +7,8 @@ weight = 10
# Query management in Explore
To help with debugging queries, Explore allows you to investigate query requests and responses, as well as query statistics, via the Query inspector.
This functionality is similar to the panel inspector [Stats tab]({{< relref "../panels/inspect-panel.md#inspect-query-performance" >}}) and
[Query tab]({{< relref "../panels/inspect-panel.md##view-raw-request-and-response-to-data-source" >}}).
This functionality is similar to the panel inspector tasks [Inspect query performance]({{< relref "../panels/query-a-data-source/inspect-query-performance.md" >}}) and
[Inspect query request and response data]({{< relref "../panels/query-a-data-source/inspect-request-and-response-data.md" >}}).
{{< figure src="/static/img/docs/v71/query_inspector_explore.png" class="docs-image--no-shadow" max-width= "550px" caption="Screenshot of the query inspector button in Explore" >}}

View File

@ -34,7 +34,7 @@ To create your first dashboard:
1. Click the **+** icon on the side menu.
1. On the dashboard, click **Add an empty panel**.
1. In the New dashboard/Edit panel view, go to the **Query** tab.
1. Configure your [query]({{< relref "../panels/queries.md" >}}) by selecting `-- Grafana --` from the [data source selector]({{< relref "../panels/queries.md/#data-source-selector" >}}). This generates the Random Walk dashboard.
1. Configure your [query]({{< relref "../panels/query-a-data-source/add-a-query" >}}) by selecting `-- Grafana --` from the data source selector. This generates the Random Walk dashboard.
1. Click the **Save** icon in the top right corner of your screen to save the dashboard.
1. Add a descriptive name, and then click **Save**.

View File

@ -365,7 +365,7 @@ ORDER BY time
There are two possible workarounds to resolve this problem:
1. In Grafana v8.0.3, use an alias of the string column selected as `metric`. for example, `hostname as metric`.
2. Use the [Standard field options/Display name]({{< relref "../panels/standard-options.md#display-name" >}}) to format the alias. For the preceding example query, you would use `${__field.labels.hostname}` option.
2. Use the [Standard field options/Display name]({{< relref "../panels/reference-standard-field-definitions.md#display-name" >}}) to format the alias. For the preceding example query, you would use `${__field.labels.hostname}` option.
For more information, refer to the our relational databases documentation of [Postgres]({{< relref "../datasources/postgres.md#time-series-queries" >}}), [MySQL]({{< relref "../datasources/mysql.md#time-series-queries" >}}), [Microsoft SQL Server]({{< relref "../datasources/mssql.md#time-series-queries" >}}).

View File

@ -1,26 +1,16 @@
+++
title = "Panels"
aliases = ["/docs/grafana/latest/features/panels/panels/"]
weight = 70
description = "Panels"
aliases = ["/docs/grafana/latest/features/panels/panels/", "/docs/sources/panels/"]
weight = 72
+++
# Panel overview
# About Grafana panels
The _panel_ is the basic visualization building block in Grafana. Each panel has a query editor specific to the data source selected in the panel. The query editor allows you to extract the perfect visualization to display on the panel.
There are a wide variety of styling and formatting options for each panel. Panels can be dragged and dropped and rearranged on the dashboard. They can also be resized.
## Move panels
Before you begin, ensure that you have configured a data source. For more information about data sources, refer to [Data Sources]({{< relref "../datasources" >}}).
You can drag and drop panels by clicking and holding the panel title, then dragging it to its new location. You can also easily resize panels by clicking the (-) and (+) icons.
![](/static/img/docs/animated_gifs/drag_drop.gif)
## Tips and shortcuts
- Click the graph title and in the dropdown menu quickly duplicate the panel.
- Click the colored icon in the legend to change a series color or the y-axis.
- Click series name in the legend to hide series.
- Ctrl/Shift/Meta + click legend name to hide other series.
- Hover your cursor over a panel and press `e` to open the panel editor.
- Hover your cursor over a panel and press `v` to open the panel in full screen view.
{{< section >}}

View File

@ -1,61 +0,0 @@
+++
title = "Add a panel"
weight = 100
+++
# Add a panel
Panels allow you to show your data in visual form. This topic walks you through the most basic steps to build a panel.
## 1. Add a panel to a dashboard
1. Navigate to the dashboard you want to add a panel to.
1. Click the **Add panel** icon.
![](/static/img/docs/panels/add-panel-icon-7-0.png)
1. Click **Add an empty panel**.
Grafana creates an empty time series panel with your default data source selected.
## 2. Write a query
Each panel needs at least one query to display a visualization. You write queries in the Query tab of the panel editor. For more information about the Query tab, refer to [Queries]({{< relref "queries.md" >}}).
1. Choose a data source. In the first line of the Query tab, click the drop-down list to see all available data sources. This list includes all data sources you added. Refer to [Add a data source]({{< relref "../datasources/add-a-data-source.md" >}}) if you need instructions.
1. Write or construct a query in the query language of your data source. Options will vary. Refer to your specific [data source documentation]({{< relref "../datasources/_index.md" >}}) for specific guidelines.
## 3. Choose a visualization
![](/static/img/docs/panel-editor/select-visualization-8-0.png)
When you choose a visualization, Grafana will offer visualization suggestions based on your query. You can select from the available suggestions or you can pick a visualization from the complete list of supported visualizations. When you select a visualization, Grafana will show a preview of your query results with that visualization applied.
For more information about individual visualizations, refer to [Visualizations options]({{< relref "../visualizations/_index.md" >}}).
## 4. (Optional) Edit panel settings
While not required, most visualizations need some adjustment before they properly display the information that you need. Options are defined in the linked topics below.
- [Panel options]({{< relref "./panel-options.md" >}})
- [Visualization-specific options]({{< relref "../visualizations/_index.md" >}})
- [Standard options]({{< relref "./standard-options.md" >}})
- [Thresholds]({{< relref "./thresholds.md" >}})
- [Value mappings]({{< relref "./value-mappings.md" >}})
- [Data links]({{< relref "../linking/data-links.md" >}})
- [Field overrides]({{< relref "./field-overrides.md" >}})
## 5. Apply changes and save
Save the dashboard. Either press Ctrl/Cmd+S or click **Save** in the upper right corner of the screen.
Your options vary depending on the changes you made and whether or not it is a new dashboard. We recommend you add a note to describe your changes before you click **Save**. Notes are very helpful if you need to revert the dashboard to a previous version.
## What next?
Our Grafana Fundamentals tutorial is a great place to start, or you can learn more about Grafana by reading one of the documentation topics linked below:
- Learn more about [panel editor]({{< relref "panel-editor.md" >}}) options.
- Add more [queries]({{< relref "queries.md" >}}).
- [Transform]({{< relref "transformations/_index.md" >}}) your data.
- Set up an [alert]({{< relref "../alerting/_index.md" >}}).
- Create [templates and variables]({{< relref "../variables/_index.md" >}}).

View File

@ -0,0 +1,12 @@
+++
title = "Enable template variables to add panels dynamically"
keywords = ["dynamic", "variable", "panel"]
aliases = ["/docs/grafana/latest/panels/repeat-panels-or-rows/", "/docs/sources/panels/add-panels-dynamically/"]
weight = 800
+++
# Enable template variables to add panels dynamically
Harness the power of Grafana by configuring the system to automatically and dynamically add panels based on criteria that you define.
{{< section >}}

View File

@ -0,0 +1,16 @@
+++
title = "About repeating panels or rows"
weight = 10
aliases = ["/docs/sources/panels/add-panels-dynamically/about-repeating-panels-rows/"]
+++
# About repeating panels and rows
You can configure Grafana to dynamically add panels or rows to a dashboard. A dynamic panel (or row) is a panel that the system creates based on the value of a variable. Variables dynamically change your queries across all panels in a dashboard.
## Grafana Play examples
You can see examples in the following dashboards:
- [Prometheus repeat](https://play.grafana.org/d/000000036/prometheus-repeat)
- [Repeated Rows Dashboard](https://play.grafana.org/d/000000153/repeat-rows).

View File

@ -0,0 +1,28 @@
+++
title = "Configure repeating panels"
weight = 20
aliases = ["/docs/sources/panels/add-panels-dynamically/configure-repeating-panels/"]
+++
# Configure repeating panels
For queries that return multiple values for a variable, you can configure Grafana to dynamically add panels based on those values.
> **Note:** Repeating panels require variables to have one or more items selected; you cannot repeat a panel zero times to hide it.
## Before you begin
- Ensure that the query includes a multi-value variable.
**To configure repeating panels**:
1. Edit the panel you want to repeat.
1. On the display options pane, expand **Panel options > Repeat options**.
1. Select a `direction`.
- Choose `horizontal` to arrange panels side-by-side. Grafana adjusts the width of a repeated panel. Currently, you cannot mix other panels on a row with a repeated panel.
- Choose `vertical` to arrange panels in a column. The width of repeated panels is the same as the original, repeated panel.
1. To propagate changes to all panels, reload the dashboard.

View File

@ -0,0 +1,26 @@
+++
title = "Configure repeating rows"
weight = 30
aliases = ["/docs/sources/panels/add-panels-dynamically/configure-repeating-rows/"]
+++
# Configure repeating rows
As seen above with the panels you can also repeat rows if you have variables set with `Multi-value` or
`Include all value` selection option.
## Before you begin
- Ensure that the query includes a multi-value variable.
**To configure repeating rows**:
1. On the dashboard home page, click **Add panel**.
1. On the **Add a panel** dialog box, click **Add a new row**.
1. Hover over the row title and click the cog icon.
1. On the `Row Options` configuration panel, select the variable for which you want to add repeating rows.
> To help provide context to dashboard users, add the variable to the row title.

View File

@ -1,110 +0,0 @@
+++
title = "Field overrides"
keywords = ["grafana", "field options", "documentation", "format fields", "overrides", "override fields"]
aliases = ["/docs/grafana/latest/panels/field-options/", "/docs/grafana/latest/panels/field-options/configure-specific-fields/"]
weight = 700
+++
# Field overrides
Overrides allow you to change the settings for one or more fields. Field options for overrides are exactly the same as the field options available in a particular visualization. The only difference is that you choose which fields to apply them to.
For example, you could change the number of decimal places shown in all numeric fields or columns by changing the **Decimals** option for **Fields with type** that matches **Numeric**.
## View existing field overrides
1. Navigate to the panel you want to edit, click the panel title, and then click **Edit**.
1. In the side pane, click **Overrides**.
Grafana displays a list of field overrides, if any have been created for this panel.
![View overrides](/static/img/docs/time-series-panel/panel-editor-8-0.png)
## Add a field override
You can override as many fields and add as many field options to each override as you want to.
1. Navigate to the panel you want to edit, click the panel title, and then click **Edit**.
1. In the side pane, click **Overrides**.
1. Click **Add field override**.
1. Select which fields an override rule will be applied to:
- **Fields with name -** Select a field from the list of all available fields. Properties you add to a rule with this selector are only applied to this single field.
- **Fields with name matching regex -** Specify fields to override with a regular expression. Properties you add to a rule with this selector are applied to all fields where the field name match the regex.
- **Fields with type -** Select fields by type, such as string, numeric, and so on. Properties you add to a rule with this selector are applied to all fields that match the selected type.
- **Fields returned by query -** Select all fields returned by a specific query, such as A, B, or C. Properties you add to a rule with this selector are applied to all fields returned by the selected query.
1. Click **Add override property**.
1. Select the field option that you want to apply.
1. Enter options by adding values in the fields. To return options to default values, delete the white text in the fields.
1. Continue to add overrides to this field by clicking **Add override property**, or you can click **Add override** and select a different field to add overrides to.
1. When finished, click **Save** to save all panel edits to the dashboard.
## Edit a field override
1. Navigate to the panel you want to edit, click the panel title, and then click **Edit**.
1. In the side pane, click **Overrides**.
1. Locate the override that you want to change. You can:
- Edit settings on existing overrides or field selection parameters.
- Delete existing override properties by clicking the **X** next to the property.
- Add additional override properties by clicking **Add override property**.
## Delete a field override
1. Navigate to the panel you want to edit, click the panel title, and then click **Edit**.
1. In the side pane, click **Overrides**.
1. Click the trash can icon next to the override that you want to delete.
## Example use case for field options and overrides
The following examples show how you might use field options and overrides.
## Field option example
Lets assume that our result set is a data frame that consists of two fields: time and temperature.
| time | temperature |
| :-----------------: | :---------: |
| 2020-01-02 03:04:00 | 45.0 |
| 2020-01-02 03:05:00 | 47.0 |
| 2020-01-02 03:06:00 | 48.0 |
Each field (column) of this structure can have field options applied that alter the way its values are displayed. This means that you can, for example, set the Unit to Temperature > Celsius, resulting in the following table:
| time | temperature |
| :-----------------: | :---------: |
| 2020-01-02 03:04:00 | 45.0 °C |
| 2020-01-02 03:05:00 | 47.0 °C |
| 2020-01-02 03:06:00 | 48.0 °C |
While we're at it, the decimal place doesn't add anything to this display. You can change the Decimals from `auto` to zero (`0`), resulting in the following table:
| time | temperature |
| :-----------------: | :---------: |
| 2020-01-02 03:04:00 | 45 °C |
| 2020-01-02 03:05:00 | 47 °C |
| 2020-01-02 03:06:00 | 48 °C |
## Field override example
Lets assume that our result set is a data frame that consists of four fields: time, high temp, low temp, and humidity.
| time | high temp | low temp | humidity |
| ------------------- | --------- | -------- | -------- |
| 2020-01-02 03:04:00 | 45.0 | 30.0 | 67 |
| 2020-01-02 03:05:00 | 47.0 | 34.0 | 68 |
| 2020-01-02 03:06:00 | 48.0 | 31.0 | 68 |
Let's apply the field options from the [field option example](#field-option-example) to apply the Celsius unit and get rid of the decimal place. This results in the following table:
| time | high temp | low temp | humidity |
| ------------------- | --------- | -------- | -------- |
| 2020-01-02 03:04:00 | 45 °C | 30 °C | 67 °C |
| 2020-01-02 03:05:00 | 47 °C | 34 °C | 68 °C |
| 2020-01-02 03:06:00 | 48 °C | 31 °C | 68 °C |
The temperature fields look good, but the humidity is nonsensical. We can fix this by applying a field option override to the humidity field and change the unit to Misc > percent (0-100). This results in a table that makes a lot more sense:
| time | high temp | low temp | humidity |
| ------------------- | --------- | -------- | -------- |
| 2020-01-02 03:04:00 | 45 °C | 30 °C | 67% |
| 2020-01-02 03:05:00 | 47 °C | 34 °C | 68% |
| 2020-01-02 03:06:00 | 48 °C | 31 °C | 68% |

View File

@ -0,0 +1,11 @@
+++
title = "Format data using value mapping"
aliases = ["/docs/grafana/latest/panels/value-mappings/", "/docs/sources/panels/format-data/"]
weight = 600
+++
# Format data using value mapping
In addition to field overrides, value mapping is a technique that you can use to change the visual treatment of data that appears in a visualization.
{{< section >}}

View File

@ -0,0 +1,52 @@
+++
title = "About value mapping"
weight = 10
aliases = ["/docs/sources/panels/format-data/about-value-mapping/"]
+++
# About value mapping
Value mapping allows you to replace values or ranges in your visualizations with words or emojis.
Values mapped via value mappings will skip the unit formatting. This means that a text value mapped to a numerical value will not be formatted using the configured unit.
![Value mappings example](/static/img/docs/value-mappings/value-mappings-example-8-0.png)
If value mappings are present in a panel, then Grafana displays a summary in the side pane of the panel editor.
> **Note:** The new value mappings are not compatible with some visualizations, such as Graph (old), Text, and Heatmap.
## Types of value mappings
Grafana supports the following value mappings:
- **Value** maps text values to a color or different display text. For example, if a value is `10`, I want Grafana to display **Perfection!** rather than the number.
- **Range** maps numerical ranges to a display text and color. For example, if a value is within a certain range, I want Grafana to display **Low** or **High** rather than the number.
- **Regex** maps regular expressions to replacement text and a color. For example, if a value is 'www.example.com', I want Grafana to display just **www**, truncating the domain.
- **Special** maps special values like `Null`, `NaN` (not a number), and boolean values like `true` and `false` to a display text and color. For example, if Grafana encounters a `null`, I want Grafana to display **N/A**.
You can also use the dots on the left as a "handle" to drag and reorder value mappings in the list.
## Time series example
Here's an example showing a Time series visualization with value mappings. Value mapping colors are not applied to this visualization, but the display text is shown on the axis.
![Value mappings time series example](/static/img/docs/value-mappings/value-mappings-summary-example-8-0.png)
## Stat example
Here's an example showing a Stat visualization with value mappings. You might want to hide the sparkline so it doesn't interfere with the values. Value mapping text colors are applied.
![Value mappings stat example](/static/img/docs/value-mappings/value-mappings-stat-example-8-0.png)
## Bar gauge example
Here's an example showing a Bar gauge visualization with value mappings. The value mapping colors are applied to the text but not the gauges.
![Value mappings bar gauge example](/static/img/docs/value-mappings/value-mappings-bar-gauge-example-8-0.png)
## Table example
Here's an example showing a Table visualization with value mappings. If you want value mapping colors displayed on the table, then set the cell display mode to **Color text** or **Color background**.
![Value mappings table example](/static/img/docs/value-mappings/value-mappings-table-example-8-0.png)

View File

@ -0,0 +1,20 @@
+++
title = "Edit a value mapping"
weight = 60
aliases = ["/docs/sources/panels/format-data/edit-value-mapping/"]
+++
# Edit a value mapping
You can change a value mapping at any time.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
- Ensure you have an existing value mapping to edit.
**To edit a value mapping**:
1. Edit the panel that contains the value mapping you want to edit.
1. In the panel display options, in the **Value mappings** section, click **Edit value mappings**.
1. Make the changes and click **Update**.

View File

@ -0,0 +1,25 @@
+++
title = "Map a range"
weight = 30
aliases = ["/docs/sources/panels/format-data/map-a-range/"]
+++
# Map a range
Map a range of values when you want to format multiple, continuous values.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To map a range**:
1. Edit the panel for which you want to map a range of values.
1. In panel display options, in the **Value mappings** section, click **Add value mappings**.
1. Click **Add a new mapping** and then select **Range**.
1. Enter the beginning and ending values in the range for Grafana to match.
1. (Optional) Enter display text.
1. (Optional) Set the color.
1. Click **Update** to save the value mapping.
![Map a range](/static/img/docs/value-mappings/map-range-8-0.png)

View File

@ -0,0 +1,23 @@
+++
title = "Map a regular expression"
weight = 40
aliases = ["/docs/sources/panels/format-data/map-a-regular-expression/"]
+++
# Map a regular expression
Map a regular expression when you want to format the text and color of a regular expression value.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To map a regular expression**:
1. Edit the panel for which you want to map a regular expression.
1. In the panel display options, in the **Value mappings** section, click **Add value mappings**.
1. Click **Add a new mapping** and then select **Regex**.
1. Enter the regular expression pattern for Grafana to match.
1. (Optional) Enter display text.
1. (Optional) Set the color.
1. Click **Update** to save the value mapping.

View File

@ -0,0 +1,31 @@
+++
title = "Map a special value"
weight = 50
aliases = ["/docs/sources/panels/format-data/map-a-special-value/"]
+++
# Map a special value
Map a special value when you want to format uncommon, boolean, or empty values.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To map a special value**:
1. Edit the panel for which you want to map a special value.
1. In panel display options, locate the **Value mappings** section and click **Add value mappings**.
1. Click **Add a new mapping** and then select **Special**.
1. Select the special value for Grafana to match. Options include:
- Null
- NaN (Not a Number)
- Null + NaN
- True
- False
- Empty
1. (Optional) Enter display text.
1. (Optional) Set the color.
1. Click **Update** to save the value mapping.
![Map a value](/static/img/docs/value-mappings/map-special-value-8-0.png)

View File

@ -0,0 +1,25 @@
+++
title = "Map a value"
weight = 20
aliases = ["/docs/sources/panels/format-data/map-a-value/"]
+++
# Map a value
Map a value when you want to format a single value.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To map a value**:
1. Open a panel for which you want to map a value.
1. In panel display options, locate the **Value mappings** section and click **Add value mappings**.
1. Click **Add a new mapping** and then select **Value**.
1. Enter the value for Grafana to match.
1. (Optional) Enter display text.
1. (Optional) Set the color.
1. Click **Update** to save the value mapping.
![Map a value](/static/img/docs/value-mappings/map-value-8-0.png)

View File

@ -1,101 +0,0 @@
+++
title = "Inspect a panel"
weight = 400
+++
# Inspect a panel
The panel inspector helps you understand and troubleshoot your panels. You can inspect the raw data for any Grafana panel, export that data to a comma-separated values (CSV) file, view query requests, and export panel and data JSON.
## Panel inspector UI
The panel inspector displays Inspect: <NameOfPanelBeingInspected> at the top of the pane. Click the arrow in the upper right corner to expand or reduce the pane.
The panel inspector consists of following tabs:
- **Data tab -** Shows the raw data returned by the query with transformations applied. Field options such as overrides and value mappings are not applied by default.
- **Stats tab -** Shows how long your query takes and how much it returns.
- **JSON tab -** Allows you to view and copy the panel JSON, panel data JSON, and data frame structure JSON. This is useful if you are provisioning or administering Grafana.
- **Query tab -** Shows you the requests to the server sent when Grafana queries the data source.
- **Error tab -** Shows the error. Only visible when query returns error.
> **Note:** Not all panel types include all four tabs. For example, dashboard list panels do not have raw data to inspect, so they do not display the Stats, Data, or Query tabs.
## Panel inspector tasks
Tasks you can perform in the panel inspector are described below.
### Open the panel inspector
You can inspect any panel that you can view.
1. In Grafana, navigate to the dashboard that contains the panel you want to inspect.
1. Click the title of the panel you want to inspect and then click **Inspect**.
Or
Hover your cursor over the panel title and then press **i**.
The panel inspector pane opens on the right side of the screen.
### Inspect raw query results
View raw query results in a table. This is the data returned by the query with transformations applied and before the panel applies field options or field option overrides.
In the inspector click the **Data** tab or in the panel menu click **Inspect > Data**.
If your panel contains multiple queries or queries multiple nodes, then you have additional options.
- **Select result -** Choose which result set data you want to view.
- **Transform data**
- **Join by time -** View raw data from all your queries at once, one result set per column. Click a column heading to reorder the data.
View raw query results in a table with field options and options overrides applied:
1. Open the **Data** tab in panel inspector.
1. Click on **Data display options** above the table.
1. Click on **Apply field configuration** toggle button.
### Download raw query results as CSV
Grafana generates a CSV file in your default browser download location. You can open it in the viewer of your choice.
1. Open the panel inspector.
1. Inspect the raw query results as described above. Adjust settings until you see the raw data that you want to export.
1. Click **Download CSV**.
To download a CSV file specifically formatted for Excel, expand the **Data options** panel and enable the **Download for Excel** toggle before clicking **Download CSV**.
### Download log results
Grafana generates a text (.txt) file in your default browser download location. You can open the log in the viewer of your choice.
1. Open the panel inspector.
1. Inspect the log query results as described above.
1. Click **Download logs**.
### Inspect query performance
The Stats tab displays statistics that tell you how long your query takes, how many queries you send, and the number of rows returned. This information can help you troubleshoot your queries, especially if any of the numbers are unexpectedly high or low.
1. Open the panel inspector.
1. Navigate to the Stats tab.
Statistics are displayed in read-only format.
### View panel JSON model
Explore and export panel, panel data, and data frame JSON models.
1. Open the panel inspector and then click the **JSON** tab or in the panel menu click **Inspect > Panel JSON**.
1. In Select source, choose one of the following options:
- **Panel JSON -** Displays a JSON object representing the panel.
- **Panel data -** Displays a JSON object representing the data that was passed to the panel.
- **DataFrame structure -** Displays the raw result set with transformations, field configuration, and overrides configuration applied.
1. You can expand or collapse portions of the JSON to explore it, or you can click **Copy to clipboard** and paste the JSON in another application.
### View raw request and response to data source
1. Open the panel inspector and then click the **Query** tab or in the panel menu click **Inspect > Query**.
1. Click **Refresh**.
Grafana sends a query to the server to collect information and then displays the result. You can now drill down on specific portions of the query, expand or collapse all of it, or copy the data to the clipboard to use in other applications.

View File

@ -1,50 +0,0 @@
+++
title = "Legend options"
aliases = ["/docs/grafana/latest/panels/visualizations/panel-legend/"]
weight = 950
+++
# Legend options
Use the legend to adjust how a visualization displays series. This legend functionality only applies to a few panels now, but it will eventually be common to all visualizations.
This topic currently applies to the following visualizations:
- [Bar chart panel]({{< relref "../visualizations/bar-chart.md">}})
- [Histogram panel]({{< relref "../visualizations/histogram.md">}})
- [Pie chart panel]({{< relref "../visualizations/pie-chart-panel.md">}})
- [State timeline panel]({{< relref "../visualizations/state-timeline.md">}})
- [Status history panel]({{< relref "../visualizations/status-history.md">}})
- [Time series panel]({{< relref "../visualizations/time-series/_index.md" >}})
- XY chart panel
## Toggle series
To toggle a series:
Click on the series label in the legend to isolate the series in the visualization.
All other series are hidden in the visualization. The data of the hidden series is still accessible.
Use Cmd/Ctrl+click on the series label to hide the isolated series and remove the toggle.
> **Note:** This option is persistent when you save the dashboard.
![Toggle series visibility](/static/img/docs/legend/legend-series-toggle-7-5.png)
This creates a system override that hides the other series. You can view this override in the Overrides tab. If you delete the override, then it removes the toggle.
![Series toggle override example](/static/img/docs/legend/legend-series-override-7-5.png)
## Change series color
Click on the series icon (colored line beside the series label) in the legend to change selected series color.
![Change legend series color](/static/img/docs/legend/legend-series-color-7-5.png)
## Sort series
Change legend mode to **Table** and choose [calculations]({{< relref "./calculations-list.md" >}}) to be displayed in the legend. Click the calculation name header in the legend table to sort the values in the table in ascending or descending order.
The sort order affects the positions of the bars in the Bar chart panel as well as the order of stacked series in the Time series and Bar chart panels.
> **Note:** This feature is only supported in these panels: Bar chart, Histogram, Time series, XY Chart.
![Sort legend series](/static/img/docs/legend/legend-series-sort-8-3.png)

View File

@ -0,0 +1,11 @@
+++
title = "Create reusable Grafana panels"
aliases = ["/docs/grafana/latest/panels/panel-library/" "/docs/sources/panels/library-panels/"]
weight = 700
+++
# Create reusable Grafana panels
Library panels enable you to create reusable panels that you can add to any dashboard in your organization.
{{< section >}}

View File

@ -0,0 +1,11 @@
+++
title = "About Grafana library panels"
weight = 10
aliases = ["/docs/sources/panels/library-panels/about-library-panels/"]
+++
# About Grafana panel libraries
A library panel is a reusable panel that you can use in any dashboard. When you make a change to a library panel, that change propegates to all instances of where the panel is used. Library panels streamline reuse of panels across multiple dashboards.
You can save a library panel in a folder alongside saved dashboards.

View File

@ -0,0 +1,27 @@
+++
title = "Add a Grafana library panel to a dashboard"
weight = 30
aliases = ["/docs/sources/panels/library-panels/add-library-panel/"]
+++
# Add a Grafana library panel to a dashboard
Add a Grafana library panel to a dashboard when you want to provide visualizations to other dashboard users.
## Before you begin
- [Create a library panel]({{< relref "../library-panels/create-library-panel.md" >}}).
**To add a library panel to a dashboard**:
1. Hover over the **+** option on the left menu, then select **Create** from the drop-down options.
The **Add** panel dialog opens.
{{< figure src="/static/img/docs/library-panels/add-library-panel-8-0.png" class="docs-image--no-shadow" max-width= "900px" caption="Screenshot of the edit panel" >}}
1. Click the **Add a panel from the panel library** option.
You will see a list of your library panels.
1. Filter the list or search to find the panel you want to add.
1. Click a panel to add it to the dashboard.

View File

@ -0,0 +1,29 @@
+++
title = "Create a Grafana library panel"
weight = 20
aliases = ["/docs/sources/panels/library-panels/create-library-panel/"]
+++
# Create a Grafana library panel
When you create a library panel, the panel on the source dashboard is converted to a library panel as well. You need to save the original dashboard once a panel is converted.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To create a library panel**:
1. Open a panel in edit mode.
1. In the panel display options, click the down arrow option to bring changes to the visualization.
{{< figure src="/static/img/docs/library-panels/create-lib-panel-from-edit-8-0.png" class="docs-image--no-shadow" max-width= "800px" caption="Screenshot of the edit panel" >}}
1. Click the **Library panels** option, and then click **Create new library panel** to open the create dialog.
{{< figure src="/static/img/docs/library-panels/create-lib-panel-8-0.png" class="docs-image--no-shadow" max-width= "500px" caption="Screenshot of the create library panel dialog" >}}
1. In **Library panel name**, enter the name.
1. In **Save in folder**, select the folder to save the library panel.
1. Click **Create library panel** to save your changes.
1. Save the dashboard.
Once created, you can modify the library panel using any dashboard on which it appears. After you save the changes, all instances of the library panel reflect these modifications.
{{< figure src="/static/img/docs/library-panels/create-from-more-8-0.png" class="docs-image--no-shadow" max-width= "900px" caption="Screenshot of the edit panel" >}}

View File

@ -0,0 +1,23 @@
+++
title = "Delete a Grafana library panel"
weight = 60
aliases = ["/docs/sources/panels/library-panels/delete-library-panel/"]
+++
# Delete a Grafana library panel
Delete a library panel when you no longer need it.
## Before you begin
- Verify that the panel does not appear on a dashboard.
**To delete a library panel**:
1. Hover over **Dashboard** on the left menu, and select Library panels from the drop-down options.
1. Select a library panel that is being used in different dashboards.
You will see a list of all the dashboards.
1. Select the panel you want to delete.
1. Click the delete icon next to the library panel name.

View File

@ -0,0 +1,24 @@
+++
title = "Manage Grafana library panels"
weight = 40
aliases = ["/docs/sources/panels/library-panels/manage-library-panel/"]
+++
# Manage Grafana library panels
You can adjust library panel configuration at any time.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To view and manage a library panel**:
1. Hover over the **Dashboard** option on the left menu, then click **Library panels**.
You can see a list of previously defined library panels.
{{< figure src="/static/img/docs/library-panels/library-panel-list-8-0.png" class="docs-image--no-shadow" max-width= "900px" caption="Screenshot of the edit panel" >}}
1. Search for a specific library panel if you know its name.
You can also filter the panels by folder or type.

View File

@ -0,0 +1,21 @@
+++
title = "Unlink a Grafana library panel"
weight = 50
aliases = ["/docs/sources/panels/library-panels/unlink-library-panel/"]
+++
# Unlink a Grafana library panel
Unlink a library panel when you want to make a change to the panel and not affect other instances of the library panel.
## Before you begin
- Identify the panel you want to unlink.
**To unlink a library panel from a dashboard**:
1. Hover over **Dashboard** on the left menu, and then click **Library panels**.
1. Select a library panel that is being used in different dashboards.
1. Select the panel you want to unlink.
1. Click the title of the panel and then click **Edit**. The panel opens in edit mode.
1. Click the **Unlink** option on the top right corner of the page.

View File

@ -0,0 +1,11 @@
+++
title = "Override field values"
aliases = ["/docs/grafana/latest/panels/field-overrides/", "/docs/sources/panels/override-field-values/"]
weight = 400
+++
# Override field values
Apply field overrides when you want to format field values that appear in a visualization.
{{< section >}}

View File

@ -0,0 +1,63 @@
+++
title = "About field overrides"
weight = 10
aliases = ["/docs/sources/panels/override-field-values/about-field-overrides/"]
+++
# About field overrides
Overrides allow you to change the settings for one or more fields. Field options for overrides are the same as the field options available in a particular visualization. The only difference is that you choose which fields to apply them to.
For example, you could change the number of decimal places shown in all numeric fields or columns by changing the **Decimals** option for **Fields with type** that matches **Numeric**.
## Example 1: Format temperature
Lets assume that our result set is a data frame that consists of two fields: time and temperature.
| time | temperature |
| :-----------------: | :---------: |
| 2020-01-02 03:04:00 | 45.0 |
| 2020-01-02 03:05:00 | 47.0 |
| 2020-01-02 03:06:00 | 48.0 |
Each field (column) of this structure can have field options applied that alter the way its values are displayed. This means that you can, for example, set the Unit to Temperature > Celsius, resulting in the following table:
| time | temperature |
| :-----------------: | :---------: |
| 2020-01-02 03:04:00 | 45.0 °C |
| 2020-01-02 03:05:00 | 47.0 °C |
| 2020-01-02 03:06:00 | 48.0 °C |
In addition, the decimal place is not required, so we can remove it. You can change the Decimals from `auto` to zero (`0`), resulting in the following table:
| time | temperature |
| :-----------------: | :---------: |
| 2020-01-02 03:04:00 | 45 °C |
| 2020-01-02 03:05:00 | 47 °C |
| 2020-01-02 03:06:00 | 48 °C |
## Example 2: Format temperature and humidity
Lets assume that our result set is a data frame that consists of four fields: time, high temp, low temp, and humidity.
| time | high temp | low temp | humidity |
| ------------------- | --------- | -------- | -------- |
| 2020-01-02 03:04:00 | 45.0 | 30.0 | 67 |
| 2020-01-02 03:05:00 | 47.0 | 34.0 | 68 |
| 2020-01-02 03:06:00 | 48.0 | 31.0 | 68 |
Let's add the Celsius unit and get rid of the decimal place. This results in the following table:
| time | high temp | low temp | humidity |
| ------------------- | --------- | -------- | -------- |
| 2020-01-02 03:04:00 | 45 °C | 30 °C | 67 °C |
| 2020-01-02 03:05:00 | 47 °C | 34 °C | 68 °C |
| 2020-01-02 03:06:00 | 48 °C | 31 °C | 68 °C |
The temperature fields look good, but the humidity must now be changed. We can fix this by applying a field option override to the humidity field and change the unit to Misc > percent (0-100).
| time | high temp | low temp | humidity |
| ------------------- | --------- | -------- | -------- |
| 2020-01-02 03:04:00 | 45 °C | 30 °C | 67% |
| 2020-01-02 03:05:00 | 47 °C | 34 °C | 68% |
| 2020-01-02 03:06:00 | 48 °C | 31 °C | 68% |

View File

@ -0,0 +1,29 @@
+++
title = "Add a field override"
weight = 30
aliases = ["/docs/sources/panels/override-field-values/add-a-field-override/"]
+++
# Add a field override
You can override a field when you want to change the display of the value in the visualization.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To add a field override**:
1. Edit the panel to which you want to add an override.
1. In the panel display options, in the **Overrides** section, click **Add field override**.
1. Select which fields an override rule will be applied to:
- **Fields with name -** Select a field from the list of all available fields. Properties you add to a rule with this selector are only applied to this single field.
- **Fields with name matching regex -** Specify fields to override with a regular expression. Properties you add to a rule with this selector are applied to all fields where the field name match the regex.
- **Fields with type -** Select fields by type, such as string, numeric, and so on. Properties you add to a rule with this selector are applied to all fields that match the selected type.
- **Fields returned by query -** Select all fields returned by a specific query, such as A, B, or C. Properties you add to a rule with this selector are applied to all fields returned by the selected query.
1. Click **Add override property**.
1. Select the field option that you want to apply.
1. Enter options by adding values in the fields. To return options to default values, delete the white text in the fields.
1. Continue to add overrides to this field by clicking **Add override property**, or you can click **Add override** and select a different field to add overrides to.
1. When finished, click **Save** to save all panel edits to the dashboard.

View File

@ -0,0 +1,22 @@
+++
title = "Delete a field override"
weight = 50
aliases = ["/docs/sources/panels/override-field-values/delete-a-field-override/"]
+++
# Delete a field override
Delete a field override when you no longer need it.
When you delete an override, the appearance of value defaults to its original format. This change impacts dashboards and dashboard users that rely on an affected panel.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
- [Add a field override]({{< relref "../override-field-values/add-a-field-override.md" >}}).
**To delete a field override**:
1. Edit the panel that contains the override you want to delete.
1. In panel display options, click the **Overrides** tab.
1. Click the override you want to delete and then click the associated trash icon.

View File

@ -0,0 +1,24 @@
+++
title = "Edit a field overrides"
weight = 40
aliases = ["/docs/sources/panels/override-field-values/edit-field-override/"]
+++
# Edit a field override
Edit a field override when you want to make changes to an override setting.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
- [Add a field override]({{< relref "../override-field-values/add-a-field-override.md" >}}).
**To edit a field override**:
1. Edit the panel that contains the overrides you want to edit.
1. In the panel display options, click the **Overrides** tab.
1. Locate the override that you want to change.
1. Perform any of the following:
- Edit settings on existing overrides or field selection parameters.
- Delete existing override properties by clicking the **X** next to the property.
- Add an override properties by clicking **Add override property**.

View File

@ -0,0 +1,21 @@
+++
title = "View field overrides"
weight = 20
aliases = ["/docs/sources/panels/override-field-values/view-field-override/"]
+++
# View field overrides
You can view field overrides in the panel display options.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
- [Add a field override]({{< relref "../override-field-values/add-a-field-override.md" >}}).
**To view field overrides**:
1. Open for edit the panel that contains the overrides you want to view.
1. In the panel display options, click the **Overrides** tab.
> The override settings that appear on the **All** tab are the same as the settings that appear on the **Overrides** tab.

View File

@ -1,86 +0,0 @@
+++
title = "Panel editor"
weight = 200
+++
# Panel editor
This page describes the parts of the Grafana panel editor and links to where you can find more information.
{{< figure src="/static/img/docs/panel-editor/panel-editor-8-0.png" class="docs-image--no-shadow" max-width="1500px" >}}
If your user account is assigned the appropriate [organization role]({{< relref "../permissions/organization_roles.md" >}}) or [permissions]({{< relref "../permissions/_index.md" >}}), then you can edit or update a panel at any point after it is created. For more information about creating panels, refer to [Add a panel]({{< relref "./add-a-panel.md" >}}).
## Open the panel editor
There are several ways to access the panel editor, also called the **Edit Panel** screen, _edit mode_, or _panel edit mode_:
- Click the **Add panel** icon at the top of the screen and then click **Add new panel**. The new panel opens in the panel editor. For detailed instructions on how to add a panel, refer to [Add a panel]({{< relref "add-a-panel.md" >}})
- Click the title of an existing panel and then click **Edit**. The panel opens in edit mode.
- Click anywhere on an existing panel and then press **e** on your keyboard. The panel opens in edit mode.
## Parts of the panel editor
This section describes the parts of the panel editor screen and a bit about fields, options, or tasks associated with each part. Some sections in this page link to pages where sections or tasks are documented more fully.
### Header
The header section lists the name of the dashboard that the panel is in and some dashboard commands. You can also click the **Go back** arrow to return to the dashboard.
{{< figure src="/static/img/docs/panel-editor/edit-panel-header-7-0.png" class="docs-image--no-shadow" max-width="1000px" >}}
On the right side of the header are the following options:
- **Dashboard settings (gear) icon -** Click to access the dashboard settings.
- **Discard -** Discards all changes you have made to the panel since you last saved the dashboard.
- **Save -** Saves the dashboard, including all changes you have made in the panel editor.
- **Apply -** Applies changes you made and then closes the panel editor, returning you to the dashboard. You will have to save the dashboard to persist the applied changes.
### Visualization preview
The visualization preview section contains viewing options, time range controls, the visualization preview, and (if applicable) the panel title, axes, and legend.
{{< figure src="/static/img/docs/panel-editor/visualization-preview-8-0.png" class="docs-image--no-shadow" max-width="1200px" >}}
- **Table view -** Convert any visualization to a table so that you can see the data. Useful for troubleshooting.
- **Fill -** The visualization preview will fill the available space in the preview part. If you change the width of the side pane or height of the bottom pane the visualization will adapt to fill whatever space is available.
- **Fit -** The visualization preview will fill the available space in but preserve the aspect ratio of the panel.
- **Exact -** The visualization preview will have the exact size as the size on the dashboard. If not enough space is available, the visualization will scale down preserving the aspect ratio.
- **Time range controls -** For more information, refer to [Time range controls]({{< relref "../dashboards/time-range-controls.md" >}}).
### Data section (bottom pane)
The section contains tabs where you enter queries, transform your data, and create alert rules (if applicable).
{{< figure src="/static/img/docs/panel-editor/data-section-8-0.png" class="docs-image--no-shadow" max-width="1200px" >}}
- **Query tab -** Select your data source and enter queries here. For more information, refer to [Queries]({{< relref "queries.md" >}}).
- **Transform tab -** Apply data transformations. For more information, refer to [Transformations]({{< relref "transformations/_index.md" >}}).
- **Alert tab -** Write alert rules. For more information, refer to [Create alerts]({{< relref "../alerting/old-alerting/create-alerts.md" >}}).
### Panel display options (side pane)
The section contains tabs where you configure almost every aspect of your data Visualization. Not all options are available for each visualization.
The data model used in Grafana, namely the [data frame]({{< relref "../developers/plugins/data-frames.md" >}}), is a columnar-oriented table structure that unifies both time series and table query results. Each column within this structure is called a _field_. A field can represent a single time series or table column.
Field options allow you to change how the data is displayed in your visualizations. Options and overrides that you apply do not change the data, however they change how Grafana displays the data.
#### Field options
When you change an option, it is applied to all fields, meaning all series or columns. For example, if you change the unit to percentage, then all fields with numeric values are displayed in percentages.
## Field overrides
_Field overrides_ can be added or viewed in the Overrides tab in the panel editor side menu. You can apply options to specific fields (series or columns) rather than all fields. Learn how to apply an override in [Field overrides]({{< relref "./field-overrides.md" >}}).
Options are documented in the following topics:
- [Add a panel]({{< relref "./add-a-panel.md" >}}) describes how to add a panel to a dashboard.
- [Panel options]({{< relref "./panel-options.md" >}})
- [Visualization options]({{< relref "../visualizations/_index.md" >}}) vary widely. They are described in the individual visualization topic.
- [Standard options]({{< relref "./standard-options.md" >}})
- [Thresholds]({{< relref "./thresholds.md" >}})
- [Value mappings]({{< relref "./value-mappings.md" >}})
- [Panel links]({{< relref "../linking/panel-links.md" >}}) and [Data links]({{< relref "../linking/data-links.md" >}}) help you connect your visualization to other resources.
- [Overrides]({{< relref "./field-overrides.md" >}})

View File

@ -1,77 +0,0 @@
+++
title = "Library panels"
weight = 410
+++
# Library panels
Library panels allow users to create reusable panels where any changes made to one instance of the library panel is reflected on every dashboard affecting all other instances where the panel is used. These panels can be saved in folders alongside Dashboards and streamline reuse of panels across multiple dashboards.
## Create a library panel
Before you can use library panels, you have to create them.
> **Note:** When you create library panels, the panel on the source dashboard is converted to a library panel as well. You will need to save the original dashboard once a panel is converted.
To create a library panel:
1. Create a Grafana panel as you normally would, following instructions in [Add a panel]({{< relref "./add-a-panel.md" >}}). You an also use an existing panel.
1. Click the title of the panel and then click **Edit**. The panel opens in edit mode.
1. In the panel display options (side pane), click the down arrow option to bring changes to the visualization.
{{< figure src="/static/img/docs/library-panels/create-lib-panel-from-edit-8-0.png" class="docs-image--no-shadow" max-width= "800px" caption="Screenshot of the edit panel" >}}
1. Click the **Library panels** option, and then click **Create new library panel** to open the create dialog.
{{< figure src="/static/img/docs/library-panels/create-lib-panel-8-0.png" class="docs-image--no-shadow" max-width= "500px" caption="Screenshot of the create library panel dialog" >}}
1. In **Library panel name**, enter the name.
1. In **Save in folder**, select the folder to save the library panel. By default, the General folder is selected.
1. Click **Create library panel** to save your changes.
1. Save the dashboard.
Optionally, you can click title of the panel and then click **More > Create Library panel**. Next, follow the instructions Step 5 in the procedure above.
{{< figure src="/static/img/docs/library-panels/create-from-more-8-0.png" class="docs-image--no-shadow" max-width= "900px" caption="Screenshot of the edit panel" >}}
Also, library panels can also be created using the “Share” option for any panel.
Once created, you can modify the library panel using any dashboard on which it appears. Once the library panel changes are saved, all instances of the library panel will reflect these modifications.
## Add a library panel
To add a library panel to a dashboard:
1. Hover over the **+** option on the left menu, then select **Create** from the drop-down options. The Add panel dialog opens.
{{< figure src="/static/img/docs/library-panels/add-library-panel-8-0.png" class="docs-image--no-shadow" max-width= "900px" caption="Screenshot of the edit panel" >}}
1. Click the **Add a panel from the panel library** option. You will see a list of your library panels.
1. Filter the list or search to find the panel you want to add.
1. Click your desired panel and add it to the dashboard.
## Manage library panels
To view and manage existing library panels:
1. Hover over the **Dashboard** option on the left menu, then click **Library panels**. You can see a list of previously defined library panels.
{{< figure src="/static/img/docs/library-panels/library-panel-list-8-0.png" class="docs-image--no-shadow" max-width= "900px" caption="Screenshot of the edit panel" >}}
1. Search for a specific library panel if you know its name. You can also filter the panels by folder or type.
## Unlink a library panel
In case you have a library panel on your dashboard that want to modify it without affecting all other instances of the library panel, you can unlink the library panel.
To unlink a library panel from a dashboard:
1. Hover over **Dashboard** on the left menu, and then click **Library panels**.
1. Select a library panel that is being used in different dashboards. You will see a list of all the dashboards where the library panel is used.
{{< figure src="/static/img/docs/library-panels/unlink-8-0.png" class="docs-image--no-shadow" max-width= "900px" caption="Screenshot of the edit panel" >}}
1. Select the panel you want to unlink and update.
1. Click the title of the panel and then click **Edit**. The panel opens in edit mode.
1. Click the **Unlink** option on the top right corner of the UI.
## Delete a library panel
Before you delete a library panel, verify that it is no longer in use on any dashboard.
To delete a library panel:
1. Hover over **Dashboard** on the left menu, and select Library panels from the drop-down options.
1. Select a library panel that is being used in different dashboards. You will see a list of all the dashboards.
1. Select the panel you want to delete.
1. Click the delete icon next to the library panel name.

View File

@ -1,38 +0,0 @@
+++
title = "Panel options"
weight = 900
+++
# Panel options
Panel options are common to all panels. They are basic options to add information and clarity to your panels. Fields are described below.
While not required, we recommend that you add a helpful title and description to all panels.
![](/static/img/docs/panels/panel-options-8-0.png)
## Title
Text entered in this field is displayed at the top of your panel in the panel editor and in the dashboard. You can use [variables you have defined]({{< relref "../variables/_index.md" >}}) in either field, but not [global variables]({{< relref "../variables/variable-types/global-variables.md" >}}).
## Description
Text entered in this field is displayed in a tooltip in the upper left corner of the panel. Write a description of the panel and the data you are displaying. Pretend you are explaining it to a new user six months from now, when it is no longer fresh in your mind. Future editors (possibly yourself) will thank you.
You can use [variables you have defined]({{< relref "../variables/_index.md" >}}) in either field, but not [global variables]({{< relref "../variables/variable-types/global-variables.md" >}}).
## Transparent background
Toggle the transparent background option on your panel display.
## Panel links
{{< docs/shared "panels/panel-links-intro.md" >}}
For more information, refer to [Panel links]({{< relref "../linking/panel-links.md" >}}).
## Repeat options
{{< docs/shared "panels/repeat-panels-intro.md" >}}
For more information, refer to [Repeat panels or rows]({{< relref "./repeat-panels-or-rows.md" >}}).

View File

@ -1,156 +0,0 @@
+++
title = "Queries"
weight = 300
+++
# Queries
_Queries_ are how Grafana panels communicate with data sources to get data for the visualization. A query is a question written in the query language used by the data source. Grafana asks, "Hey data source, would you send me this data, organized this way?" If the query is properly formed, then the data source responds. How often the query is sent to the data source and how many data points are collected can be adjusted in the panel data source options.
Grafana supports up to 26 queries per panel.
## Query editors
Query editors are forms that help you write queries. Depending on your data source, the query editor might provide auto-completion, metric names, or variable suggestion.
Because of the difference between query languages, data sources may have query editors that look different. Here are two examples of query editors:
**InfluxDB query editor**
{{< figure src="/static/img/docs/queries/influxdb-query-editor-7-2.png" class="docs-image--no-shadow" max-width="1000px" >}}
**Prometheus (PromQL) query editor**
{{< figure src="/static/img/docs/queries/prometheus-query-editor-7-4.png" class="docs-image--no-shadow" max-width="1000px" >}}
## Query syntax
Data sources have different query languages and syntaxes to ask for the data. Here are two query examples:
**PostgreSQL**
```
SELECT hostname FROM host WHERE region IN($region)
```
**PromQL**
```
query_result(max_over_time(<metric>[${__range_s}s]) != <state>)
```
For more information about writing a query for your data source, refer to the specific [Grafana data source]({{< relref "../datasources/_index.md" >}}) documentation.
## Query tab UI
The Query tab consists of the following elements:
- Data source selector
- Query options
- Query inspector button
- Query editor list
- Expressions
{{< figure src="/static/img/docs/queries/query-editor-7-2.png" class="docs-image--no-shadow" max-width="1000px" >}}
### Data source selector
The data source selector is a drop-down list. Click it to select a data source you have added. When you create a panel, Grafana automatically selects your default data source. For more information about adding data sources, refer to [Add a data source]({{< relref "../datasources/add-a-data-source.md" >}}).
{{< figure src="/static/img/docs/queries/data-source-selector-7-0.png" class="docs-image--no-shadow" max-width="250px" >}}
In addition to the data sources that you have configured in your Grafana, there are three special data sources available:
- **Grafana -** A built-in data source that generates random walk data. Useful for testing visualizations and running experiments.
- **Mixed -** Select this to query multiple data sources in the same panel. When this data source is selected, Grafana allows you to select a data source for every new query that you add.
- The first query will use the data source that was selected before you selected **Mixed**.
- You cannot change an existing query to use the Mixed Data Source.
- **Dashboard -** Select this to use a result set from another panel in the same dashboard.
### Query options
Click **Query options** next to the data source selector to see settings for your selected data source. Changes you make here affect only queries made in this panel.
{{< figure src="/static/img/docs/queries/data-source-options-7-0.png" class="docs-image--no-shadow" max-width="1000px" >}}
Grafana sets defaults that are shown in dark gray text. Changes are displayed in white text. To return a field to the default setting, delete the white text from the field.
Panel data source query options:
- **Max data points -** If the data source supports it, sets the maximum numbers of data points for each series returned. If the query returns more data points than the max data points setting, then the data source consolidates them (reduces the number of points returned by aggregating them together by average or max or other function).
There are two main reasons for limiting the number of points, performance and smoothing the line. The default value is the width (or number of pixels) of the graph as there is no point in having more data points than the graph panel can display.
With streaming data, the max data points value is used for the rolling buffer. (Streaming is a continuous flow of data and buffering is a way of dividing the stream into chunks). Loki streams data in the live tailing mode.
- **Min interval -** Sets a minimum limit for the automatically calculated interval, typically the minimum scrape interval. If a data point is saved every 15 seconds, then there's no point in having an interval lower than that. Another use case is to set it to a higher minimum than the scrape interval to get more coarse-grained, well-functioning queries.
- **Interval -** The interval is a time span that you can use when aggregating or grouping data points by time.
Grafana automatically calculates an appropriate interval and it can be used as a variable in templated queries. The variable is either in seconds: `$__interval` or in milliseconds: `$__interval_ms`. It is typically used in aggregation functions like sum or average. For example, a Prometheus query using the interval variable: `rate(http_requests_total[$__interval])`.
This automatic interval is calculated based on the width of the graph. If the user zooms out a lot then the interval becomes greater, resulting in a more coarse grained aggregation whereas if the user zooms in then the interval decreases resulting in a more fine grained aggregation.
For more information, refer to [Global variables]({{< relref "../variables/variable-types/global-variables.md" >}}).
- **Relative time -** You can override the relative time range for individual panels, causing them to be different than what is selected in the dashboard time picker in the top right corner of the dashboard. This allows you to show metrics from different time periods or days on the same dashboard.
> **Note:** Panel time overrides have no effect when the time range for the dashboard is absolute.
- **Time shift -** The time shift function is another way to override the time range for individual panels. It only works with relative time ranges and allows you to adjust the time range.
For example, you could shift the time range for the panel to be two hours earlier than the dashboard time picker. For more information, refer to [Time range controls]({{< relref "../dashboards/time-range-controls.md" >}}).
- **Cache timeout -** (This field is only visible if available in your data source.) If your time series store has a query cache, then this option can override the default cache timeout. Specified as a numeric value in seconds.
### Examples:
- **Relative time:**
| Example | Relative time field |
| ---------------- | ------------------- |
| Last 5 minutes | `now-5m` |
| The day so far | `now/d` |
| Last 5 days | `now-5d/d` |
| This week so far | `now/w` |
| Last 2 years | `now-2y/y` |
- **Time shift:**
| Example | Time shift field |
| -------------------- | ---------------- |
| Last entire week | `1w/w` |
| Two entire weeks ago | `2w/w` |
| Last entire month | `1M/M` |
| This entire year | `1d/y` |
| Last entire year | `1y/y` |
### Query inspector button
You can click **Query inspector** to open the Query tab of the panel inspector where you can see the query request sent by the panel and the response.
Click **Refresh** to see the full text of the request sent by this panel to the server.
> **Note:** You need to add at least one query before the Query inspector can return results.
For more information about the panel inspector, refer to [Inspect a panel]({{< relref "inspect-panel.md" >}}).
### Query editor list
In the UI, queries are organized in collapsible query rows. Each query row contains a query editor and is identified with a letter (A, B, C, and so on).
You can:
| Icon | Description |
| :-----------------------------------------------------------------------------------------------------------------------------------------: | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| {{< figure src="/static/img/docs/queries/query-editor-help-7-4.png" class="docs-image--no-shadow" max-width="30px" max-height="30px" >}} | Toggle query editor help. If supported by the data source, click this icon to display information on how to use the query editor or provide quick access to common queries. |
| {{< figure src="/static/img/docs/queries/duplicate-query-icon-7-0.png" class="docs-image--no-shadow" max-width="30px" max-height="30px" >}} | Copy a query. Duplicating queries is useful when working with multiple complex queries that are similar and you want to either experiment with different variants or do minor alterations. |
| {{< figure src="/static/img/docs/queries/hide-query-icon-7-0.png" class="docs-image--no-shadow" max-width="30px" max-height="30px" >}} | Hide a query. Grafana does not send hidden queries to the data source. |
| {{< figure src="/static/img/docs/queries/remove-query-icon-7-0.png" class="docs-image--no-shadow" max-width="30px" max-height="30px" >}} | Remove a query. Removing a query permanently deletes it, but sometimes you can recover deleted queries by reverting to previously saved versions of the panel. |
| {{< figure src="/static/img/docs/queries/query-drag-icon-7-2.png" class="docs-image--no-shadow" max-width="30px" max-height="30px" >}} | Reorder queries. Change the order of queries by clicking and holding the drag icon, then drag queries where desired. The order of results reflects the order of the queries, so you can often adjust your visual results based on query order. |
### Expressions
If your data source supports them, then Grafana displays the **Expression** button and shows any existing expressions in the query editor list.
For more information about expressions, refer to [Expressions]({{< relref "expressions.md" >}}).

View File

@ -0,0 +1,11 @@
+++
title = "Query a data source"
aliases = ["/docs/grafana/latest/panels/queries/", "/docs/grafana/latest/panels/expressions/", "/docs/grafana/latest/panels/inspect-panel/", "/docs/grafana/latest/panels/share-query-results/", "/docs/sources/panels/query-a-data-source/_index/"]
weight = 200
+++
# Query a data source
Data source queries return data that appear in visualizations. The query language in which you write depends on the data source you query. Grafana supports connections with many types of data sources.
{{< section >}}

View File

@ -0,0 +1,55 @@
+++
title = "About queries"
weight = 10
aliases = ["/docs/sources/panels/query-a-data-source/about-queries/"]
+++
# About queries
_Queries_ are how Grafana panels communicate with data sources to get data for the visualization. A query is a question written in the query language used by the data source. How often the query is sent to the data source and how many data points are collected can be adjusted in the panel data source options.
Use you a query editor to write a query. Each data source has its own query editor that we have customized to include the features and capabilities of the data source. Grafana supports up to 26 queries per panel.
> Important! You must be familiar with the query language of the data source. For more information about data sources, refer to [Data sources](../../../datasources/).
## Query editors
Depending on your data source, the query editor might provide auto-completion, metric names, or variable suggestions.
Because of the difference between query languages, data sources have query editors that look different. Here are two examples of query editors.
**InfluxDB query editor**
{{< figure src="/static/img/docs/queries/influxdb-query-editor-7-2.png" class="docs-image--no-shadow" max-width="1000px" >}}
**Prometheus (PromQL) query editor**
{{< figure src="/static/img/docs/queries/prometheus-query-editor-7-4.png" class="docs-image--no-shadow" max-width="1000px" >}}
## Query syntax
Data sources use different query languages to return data. Here are two query examples:
**PostgreSQL**
```
SELECT hostname FROM host WHERE region IN($region)
```
**PromQL**
```
query_result(max_over_time(<metric>[${__range_s}s]) != <state>)
```
## Data sources used in queries
In addition to the data sources that you have configured in Grafana, there are three special data sources available:
- **Grafana -** A built-in data source that generates random walk data, which can be useful for testing visualizations and running experiments.
- **Mixed -** Select this option to query multiple data sources in the same panel. When you select this data source, Grafana enables you to select a data source for every new query that you add.
- The first query uses the data source that was selected before you selected **Mixed**.
- You cannot change an existing query to use the Mixed Data Source.
- **Dashboard -** Select this option to use a result set from another panel in the same dashboard.
You can combine data from multiple data sources onto a single dashboard, but each panel is tied to a specific data source that belongs to a particular Organization.

View File

@ -0,0 +1,30 @@
+++
title = "Add a query"
weight = 30
aliases = ["/docs/sources/panels/query-a-data-source/add-a-query/"]
+++
# Add a query
A query returns data that Grafana visualizes in dashboards. When you create a panel, Grafana automatically selects the default data source.
## Before you begin
- [Add a data source](../../../datasources/add-a-data-source).
- Ensure that you know the query language of the data source.
- [Add a panel]({{< relref "../working-with-panels/add-panel.md" >}}).
**To add a query**:
1. Edit the panel to which you are adding a query.
1. Click the **Query** tab.
1. Click the **Data source** drop-down menu and select a data source.
1. Click **Query options** to configure the maximum number of data points returned by the query and how frequently you want the query to request data from the data source.
For more information about query options, refer to [Reference: Query options]({{< relref "../reference-query-options.md" >}}).
1. Write the query.
1. Click **Apply**.
The system queries the data source and presents the data in the visualization.

View File

@ -0,0 +1,30 @@
+++
title = "Download raw query results"
weight = 70
aliases = ["/docs/sources/panels/query-a-data-source/download-raw-query-results/"]
+++
# Download raw query results
Grafana generates a CSV file that contains your data, including any transformations to that data. You can choose to view the data before or after the panel applies field options or field option overrides.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
- [Add a query]({{< relref "../query-a-data-source/add-a-query.md" >}}).
**To download raw query results**:
1. Edit the panel that contains the query data you want to download.
1. In the query editor, click **Query Inspector**.
1. Click **Data**.
If your panel contains multiple queries or queries multiple nodes, then you have additional options.
- **Select result**: Choose which result set data you want to view.
- **Transform data**
- **Join by time**: View raw data from all your queries at once, one result set per column. Click a column heading to reorder the data.
1. To see data before the system applies field overrides, click the **Formatted data** toggle.
1. To download a CSV file specifically formatted for Excel, click the **Download for Excel** toggle .
1. Click **Download CSV**.

View File

@ -0,0 +1,22 @@
+++
title = "Inspect query performance"
weight = 80
aliases = ["/docs/sources/panels/query-a-data-source/inspect-query-performance/"]
+++
# Inspect query performance
The **Stats** tab displays statistics that tell you how long your query takes, how many queries you send, and the number of rows returned. This information can help you troubleshoot your queries, especially if any of the numbers are unexpectedly high or low.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
- [Add a query]({{< relref "../query-a-data-source/add-a-query.md" >}}).
**To inspect query performance**:
1. Edit the panel that contains the query with performance you want to inspect.
1. In the query editor, click **Query Inspector**.
1. Click **Stats**.
Statistics are displayed in read-only format.

View File

@ -0,0 +1,25 @@
+++
title = "Inspect query request and response data"
weight = 90
aliases = ["/docs/sources/panels/query-a-data-source/inspect-request-and-response-data/"]
+++
# Inspect query request and response data
Inspect query request and response data when you want to troubleshoot a query that returns unexpected results, or fails to return expected results.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
- [Add a query]({{< relref "../query-a-data-source/add-a-query.md" >}}).
**To inspect query request and response data**:
1. Edit the panel that contains the query you want to export.
1. In the query editor, click **Query Inspector**.
1. Click **Refresh**.
The panel populates with response data.
1. Make adjustments, as necessary and re-run the query.
1. To download the query request and response data, click the **Copy to clipboard** icon and paste the results into another application.

View File

@ -0,0 +1,19 @@
+++
title = "Manage queries"
weight = 50
aliases = ["/docs/sources/panels/query-a-data-source/manage-queries/"]
+++
# Manage queries
Queries are organized in collapsible query rows. Each query row contains a query editor and is identified with a letter (A, B, C, and so on).
You can:
| Icon | Description |
| :-----------------------------------------------------------------------------------------------------------------------------------------: | :--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| {{< figure src="/static/img/docs/queries/query-editor-help-7-4.png" class="docs-image--no-shadow" max-width="30px" max-height="30px" >}} | Toggle query editor help. If supported by the data source, click this icon to display information on how to use the query editor or provide quick access to common queries. |
| {{< figure src="/static/img/docs/queries/duplicate-query-icon-7-0.png" class="docs-image--no-shadow" max-width="30px" max-height="30px" >}} | Copy a query. Duplicating queries is useful when working with multiple complex queries that are similar and you want to either experiment with different variants or do minor alterations. |
| {{< figure src="/static/img/docs/queries/hide-query-icon-7-0.png" class="docs-image--no-shadow" max-width="30px" max-height="30px" >}} | Hide a query. Grafana does not send hidden queries to the data source. |
| {{< figure src="/static/img/docs/queries/remove-query-icon-7-0.png" class="docs-image--no-shadow" max-width="30px" max-height="30px" >}} | Remove a query. Removing a query permanently deletes it, but sometimes you can recover deleted queries by reverting to previously saved versions of the panel. |
| {{< figure src="/static/img/docs/queries/query-drag-icon-7-2.png" class="docs-image--no-shadow" max-width="30px" max-height="30px" >}} | Reorder queries. Change the order of queries by clicking and holding the drag icon, then drag queries where desired. The order of results reflects the order of the queries, so you can often adjust your visual results based on query order. |

View File

@ -0,0 +1,17 @@
+++
title = "Navigate the query tab"
weight = 20
aliases = ["/docs/sources/panels/query-a-data-source/navigate-query-tab/"]
+++
# Navigate the query tab
The Query tab consists of the following elements:
- Data source selector: Use the data source selector to select the source of the data you want to query. For more information about data sources, refer to [Data sources](../../../datasources/).
- Query options: Enables you to set maximum data retrieved parameters and query execution time intervals.
- Query inspector button: Open the query inspector panel where you can view and optimize your query.
- Query editor list: Lists the queries you have written.
- Expressions: Use the expression builder to create alert expressions. For more information about expressions, refer to [Use expressions to manipulate data](../use-expressions-to-manipulate-data/).
{{< figure src="/static/img/docs/queries/query-editor-7-2.png" class="docs-image--no-shadow" max-width="1000px" >}}

View File

@ -1,9 +1,10 @@
+++
title = "Share query results"
weight = 310
title = "Share query results with another panel"
weight = 60
aliases = ["/docs/sources/panels/query-a-data-source/share-query/"]
+++
# Share query results between panels
# Share query results with another panel
Grafana let you use the query result from one panel for any other panel in the dashboard. Sharing query results across panels reduces the number of queries made to your data source, which can improve the performance of your dashboard.
@ -11,12 +12,15 @@ The Dashboard data source lets you select a panel in your dashboard that contain
This strategy can drastically reduce the number of queries being made when you for example have several panels visualizing the same data.
To share data source queries with another panel:
**To share data source queries with another panel**:
1. [Create a dashboard]({{< relref "../getting-started/getting-started.md#create-a-dashboard" >}}).
1. [Add a panel]({{< relref "add-a-panel.md" >}}) to the dashboard.
1. [Create a dashboard]({{< relref "../../getting-started/getting-started.md/#step-3-create-a-dashboard" >}}).
1. [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
1. Change the title to "Source panel". You'll use this panel as a source for the other panels.
Define the [query]({{< relref "queries.md" >}}) or queries that will be shared. If you don't have a data source available at the moment, then you can use the **Grafana** data source, which returns a random time series that you can use for testing.
1. Define the [query]({{< relref "../query-a-data-source/add-a-query.md" >}}) or queries that you want share.
If you don't have a data source available, use the **Grafana** data source, which returns a random time series that you can use for testing.
1. Add a second panel and select the **Dashboard** data source in the query editor.
1. In the **Use results from panel list**, select the first panel you created.

View File

@ -0,0 +1,11 @@
+++
title = "Use expressions to manipulate data"
weight = 40
aliases = ["/docs/sources/panels/query-a-data-source/use-expressions-to-manipulate-data/"]
+++
# Use expressions to manipulate data
Server-side expressions enable you to manipulate data returned from queries with math and other operations. Expressions create new data and do not manipulate the data returned by data sources.
{{< section >}}

View File

@ -1,9 +1,10 @@
+++
title = "Expressions"
weight = 800
title = "About expressions"
weight = 10
aliases = ["/docs/sources/panels/query-a-data-source/use-expressions-to-manipulate-data/about-expressions/"]
+++
# Server-side expressions
# About expressions
> **Note:** This documentation is for a beta feature.
@ -11,7 +12,7 @@ Server-side expressions allow you to manipulate data returned from queries with
## Using expressions
Expressions are primarily used by the new [Grafana 8 alerts]({{< relref "../alerting/unified-alerting/" >}}). The processing is done server-side, so expressions can operate without a browser session. However, expressions can also be used with backend data sources and visualization.
Expressions are primarily used by the new [Grafana 8 alerts]({{< relref "../../../alerting/unified-alerting/_index.md" >}}). The processing is done server-side, so expressions can operate without a browser session. However, expressions can also be used with backend data sources and visualization.
> **Note:** Expressions do not work with legacy dashboard alerts.
@ -21,20 +22,20 @@ Expressions are meant to augment data sources by enabling queries from different
> **Note:** When possible, you should do data processing inside the data source. Copying data from storage to the Grafana server for processing is inefficient, so expressions are targeted at lightweight data processing.
Expressions work with data source queries that return time series or number data. They also operate on [multiple-dimensional data]({{< relref "../basics/timeseries-dimensions.md" >}}). For example, a query that returns multiple series, where each series is identified by labels or tags.
Expressions work with data source queries that return time series or number data. They also operate on [multiple-dimensional data]({{< relref "../../../basics/timeseries-dimensions.md" >}}). For example, a query that returns multiple series, where each series is identified by labels or tags.
An individual expression takes one or more queries or other expressions as input and adds data to the result. Each individual expression or query is represented by a variable that is a named identifier known as its RefID (e.g., the default letter `A` or `B`).
To reference the output of an individual expression or a data source query in another expression, this identifier is used as a variable.
## Types of expression
## Types of expressions
Expressions work with two types of data.
- A collection of time series.
- A collection of numbers, where each item in the collection is a single number.
- A collection of numbers, where each number is an item.
Each collection is returned from a single data source query or expression and represented by the RefID. Each collection is a set, where each item in the set is uniquely identified by it dimensions which are stored as [labels]({{< relref "../basics/timeseries-dimensions.md#labels" >}}) or key-value pairs.
Each collection is returned from a single data source query or expression and represented by the RefID. Each collection is a set, where each item in the set is uniquely identified by its dimensions which are stored as [labels]({{< relref "../../../basics/timeseries-dimensions.md#labels" >}}) or key-value pairs.
## Data source queries
@ -49,7 +50,7 @@ Currently, the only non-time series format (number) is supported when using data
| MIA | A | 1 |
| NYC | B | 2 |
will produce a number that works with expressions. The string columns become labels and the number column the corresponding value. For example `{"Loc": "MIA", "Host": "A"}` with a value of 1.
The example above will produce a number that works with expressions. The string columns become labels and the number column the corresponding value. For example `{"Loc": "MIA", "Host": "A"}` with a value of 1.
## Operations
@ -75,7 +76,7 @@ With binary operations, such as `$A + $B` or `$A || $B`, the operator is applied
- If one variable is a number, and the other variable is a time series, then the operation between the value of each point in the time series and the number is performed.
- If both `$A` and `$B` are time series data, then the operation between each value in the two series is performed for each time stamp that exists in both `$A` and `$B`. The Resample operation can be used to line up time stamps. (**Note:** in the future, we plan to add options to the Math operation for different behaviors).
So in summary:
Summary:
- Number OP number = number
- Number OP series = series

View File

@ -0,0 +1,26 @@
+++
title = "Write an expression"
weight = 20
aliases = ["/docs/sources/panels/query-a-data-source/use-expressions-to-manipulate-data/write-an-expression/"]
+++
# Write an expression
If your data source supports them, then Grafana displays the **Expression** button and shows any existing expressions in the query editor list.
For more information about expressions, refer to [About expressions]({{< relref "./about-expressions.md" >}}).
## Before you begin
- [Add a panel]({{< relref "../../working-with-panels/add-panel.md" >}}).
**To write an expression**:
1. Open the panel.
1. Below the query, click **Expression**.
1. In the **Operation** field, select the type of expression you want to write.
For more information about expression operations, refer to [About expressions]({{< relref "./about-expressions.md" >}}).
1. Write the expression.
1. Click **Apply**.

View File

@ -1,13 +1,12 @@
+++
title = "Calculations list"
weight = 460
title = "Reference: Calculation types"
aliases = ["/docs/grafana/latest/panels/calculations-list/", "/docs/sources/panels/reference-calculation-types/"]
weight = 1100
+++
# List of calculations
# Reference: Calculations
This topic lists and defines calculations used in Grafana.
Among other places, these calculations are used in the Transform tab and the bar gauge, gauge, and stat visualizations.
Refer to the following list of calculations you can perform in Grafana. You can find these calculations in the **Transform** tab and in the bar gauge, gauge, and stat visualizations.
| Calculation | Description |
| :----------------- | :-------------------------------------------------------- |

View File

@ -0,0 +1,61 @@
+++
title = "Reference: Query options"
aliases = ["/docs/sources/panels/reference-query-options/"]
weight = 900
+++
# Reference: Query options
Click **Query options** next to the data source selector to see settings for your selected data source. Changes you make here affect only queries made in this panel.
{{< figure src="/static/img/docs/queries/data-source-options-7-0.png" class="docs-image--no-shadow" max-width="1000px" >}}
Grafana sets defaults that are shown in dark gray text. Changes are displayed in white text. To return a field to the default setting, delete the white text from the field.
Panel data source query options:
- **Max data points -** If the data source supports it, sets the maximum numbers of data points for each series returned. If the query returns more data points than the max data points setting, then the data source consolidates them (reduces the number of points returned by aggregating them together by average or max or other function).
There are two main reasons for limiting the number of points, performance and smoothing the line. The default value is the width (or number of pixels) of the graph as there is no point in having more data points than the graph panel can display.
With streaming data, the max data points value is used for the rolling buffer. (Streaming is a continuous flow of data and buffering is a way of dividing the stream into chunks). Loki streams data in the live tailing mode.
- **Min interval -** Sets a minimum limit for the automatically calculated interval, typically the minimum scrape interval. If a data point is saved every 15 seconds, then there's no point in having an interval lower than that. Another use case is to set it to a higher minimum than the scrape interval to get more coarse-grained, well-functioning queries.
- **Interval -** The interval is a time span that you can use when aggregating or grouping data points by time.
Grafana automatically calculates an appropriate interval and it can be used as a variable in templated queries. The variable is either in seconds: `$__interval` or in milliseconds: `$__interval_ms`. It is typically used in aggregation functions like sum or average. For example, a Prometheus query using the interval variable: `rate(http_requests_total[$__interval])`.
This automatic interval is calculated based on the width of the graph. If the user zooms out a lot then the interval becomes greater, resulting in a more coarse grained aggregation whereas if the user zooms in then the interval decreases resulting in a more fine grained aggregation.
For more information, refer to [Global variables]({{< relref "../variables/variable-types/global-variables.md" >}}).
- **Relative time -** You can override the relative time range for individual panels, causing them to be different than what is selected in the dashboard time picker in the top right corner of the dashboard. This allows you to show metrics from different time periods or days on the same dashboard.
- **Time shift -** The time shift function is another way to override the time range for individual panels. It only works with relative time ranges and allows you to adjust the time range.
For example, you could shift the time range for the panel to be two hours earlier than the dashboard time picker. For more information, refer to [Time range controls]({{< relref "../dashboards/time-range-controls.md" >}}).
- **Cache timeout -** (This field is only visible if available in your data source.) If your time series store has a query cache, then this option can override the default cache timeout. Specified as a numeric value in seconds.
### Examples:
- **Relative time:**
| Example | Relative time field |
| ---------------- | ------------------- |
| Last 5 minutes | `now-5m` |
| The day so far | `now/d` |
| Last 5 days | `now-5d/d` |
| This week so far | `now/w` |
| Last 2 years | `now-2y/y` |
- **Time shift:**
| Example | Time shift field |
| -------------------- | ---------------- |
| Last entire week | `1w/w` |
| Two entire weeks ago | `2w/w` |
| Last entire month | `1M/M` |
| This entire year | `1d/y` |
| Last entire year | `1y/y` |

View File

@ -1,11 +1,10 @@
+++
title = "Standard field options"
keywords = ["grafana", "table options", "documentation", "format tables"]
aliases = ["/docs/grafana/latest/panels/field-options/standard-field-options/"]
weight = 430
title = "Reference: Standard field definitions"
aliases = ["/docs/sources/panels/reference-standard-field-definitions/"]
weight = 1200
+++
# Standard field options
# Reference: Standard field definitions
This section explains all available standard options. They are listed in alphabetical order.
@ -82,35 +81,3 @@ You can also paste a native emoji in the unit picker and pick it as a custom uni
### String units
Grafana can sometime be too aggressive in parsing strings and displaying them as numbers. To make Grafana show the original string create a field override and add a unit property with the `string` unit.
## Color scheme
{{< figure src="/static/img/docs/v73/color_scheme_dropdown.png" max-width="350px" caption="Color scheme" class="pull-right" >}}
The color scheme option defines how Grafana colors series or fields. There are multiple modes here that work very differently and their utility depends largely on what visualization you currently have selected.
Some visualizations have different color options.
### Color by value
In addition to deriving color from thresholds there are also continuous (gradient) color schemes. These are useful for visualizations that color individual values. For example, stat panels and the table panel.
Continuous color modes use the percentage of a value relative to min and max to interpolate a color.
<div class="clearfix"></div>
### Palettes
Select a palette from the **Color scheme** list.
| Color mode | Description |
| ------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Single color** | Specify a single color, useful in an override rule |
| **From thresholds** | Informs Grafana to take the color from the matching threshold |
| **Classic palette** | Grafana will assign color by looking up a color in a palette by series index. Useful for Graphs and pie charts and other categorical data visualizations |
| **Green-Yellow-Red (by value)** | Continuous color scheme |
| **Blue-Yellow-Red (by value)** | Continuous color scheme |
| **Blues (by value)** | Continuous color scheme (panel background to blue) |
| **Reds (by value)** | Continuous color scheme (panel background color to blue) |
| **Greens (by value)** | Continuous color scheme (panel background color to blue) |
| **Purple (by value)** | Continuous color scheme (panel background color to blue) |

View File

@ -1,71 +1,33 @@
+++
title = "Types and options"
weight = 2
title = "Reference: Transformation functions"
aliases = ["/docs/grafana/latest/panels/transformations/types-options/", "docs/sources/panels/reference-transformation-functions/"]
weight = 1000
+++
# Transformation types and options
# Reference: Transformation functions
Grafana comes with the following transformations:
You can perform the following transformations on your data.
- [Add field from calculation]({{< relref "./types-options.md#add-field-from-calculation" >}})
- [Concatenate fields]({{< relref "./types-options.md#concatenate-fields" >}})
- [Config from query results]({{< relref "./config-from-query.md" >}})
- [Convert field type]({{< relref "./types-options.md#convert-field-type" >}})
- [Filter data by name]({{< relref "./types-options.md#filter-data-by-name" >}})
- [Filter data by query]({{< relref "./types-options.md#filter-data-by-query" >}})
- [Filter data by value]({{< relref "./types-options.md#filter-data-by-value" >}})
- [Group by]({{< relref "./types-options.md#group-by" >}})
- [Labels to fields]({{< relref "./types-options.md#labels-to-fields" >}})
- [Merge]({{< relref "./types-options.md#merge" >}})
- [Organize fields]({{< relref "./types-options.md#organize-fields" >}})
- [Outer join]({{< relref "./types-options.md#join-by-field-outer-join" >}})
- [Reduce]({{< relref "./types-options.md#reduce" >}})
- [Rename by regex]({{< relref "./types-options.md#rename-by-regex" >}})
- [Rows to fields]({{< relref "./rows-to-fields" >}})
- [Series to rows]({{< relref "./types-options.md#series-to-rows" >}})
- [Sort by]({{< relref "./types-options.md#sort-by" >}})
- [Prepare-time-series]({{< relref "./types-options.md#prepare-time-series" >}})
## Add field from calculation
Keep reading for detailed descriptions of each type of transformation and the options available for each, as well as suggestions on how to use them.
Use this transformation to add a new field calculated from two other fields. Each transformation allows you to add one new field.
## Reduce
- **Mode -** Select a mode:
- **Reduce row -** Apply selected calculation on each row of selected fields independently.
- **Binary option -** Apply basic math operation(sum, multiply, etc) on values in a single row from two selected fields.
- **Field name -** Select the names of fields you want to use in the calculation for the new field.
- **Calculation -** If you select **Reduce row** mode, then the **Calculation** field appears. Click in the field to see a list of calculation choices you can use to create the new field. For information about available calculations, refer to [Reference: Calculations]({{< relref "./reference-calculation-types.md" >}}).
- **Operation -** If you select **Binary option** mode, then the **Operation** fields appear. These fields allow you to do basic math operations on values in a single row from two selected fields. You can also use numerical values for binary operations.
- **Alias -** (Optional) Enter the name of your new field. If you leave this blank, then the field will be named to match the calculation.
- **Replace all fields -** (Optional) Select this option if you want to hide all other fields and display only your calculated field in the visualization.
The _Reduce_ transformation applies a calculation to each field in the frame and return a single value. Time fields are removed when applying
this transformation.
In the example below, I added two fields together and named them Sum.
Consider the input:
{{< figure src="/static/img/docs/transformations/add-field-from-calc-stat-example-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
Query A:
## Concatenate fields
| Time | Temp | Uptime |
| ------------------- | ---- | ------- |
| 2020-07-07 11:34:20 | 12.3 | 256122 |
| 2020-07-07 11:24:20 | 15.4 | 1230233 |
Query B:
| Time | AQI | Errors |
| ------------------- | --- | ------ |
| 2020-07-07 11:34:20 | 6.5 | 15 |
| 2020-07-07 11:24:20 | 3.2 | 5 |
The reduce transformer has two modes:
- **Series to rows -** Creates a row for each field and a column for each calculation.
- **Reduce fields -** Keeps the existing frame structure, but collapses each field into a single value.
For example, if you used the **First** and **Last** calculation with a **Series to rows** transformation, then
the result would be:
| Field | First | Last |
| ------ | ------ | ------- |
| Temp | 12.3 | 15.4 |
| Uptime | 256122 | 1230233 |
| AQI | 6.5 | 3.2 |
| Errors | 15 | 5 |
The **Reduce fields** with the **Last** calculation,
results in two frames, each with one row:
This transformation combines all fields from all frames into one result. Consider:
Query A:
@ -79,32 +41,47 @@ Query B:
| --- | ------ |
| 3.2 | 5 |
## Merge
After you concatenate the fields, the data frame would be:
Use this transformation to combine the result from multiple queries into one single result. This is helpful when using the table panel visualization. Values that can be merged are combined into the same row. Values are mergeable if the shared fields contain the same data. For information, refer to [Table panel]({{< relref "../../visualizations/table/_index.md" >}}).
| Temp | Uptime | AQI | Errors |
| ---- | ------- | --- | ------ |
| 15.4 | 1230233 | 3.2 | 5 |
In the example below, we have two queries returning table data. It is visualized as two separate tables before applying the transformation.
## Config from query results
Query A:
This transformation allow you to select one query and from it extract standard options like **Min**, **Max**, **Unit** and **Thresholds** and apply it to other query results. This enables dynamic query driven visualization configuration.
| Time | Job | Uptime |
| ------------------- | ------- | --------- |
| 2020-07-07 11:34:20 | node | 25260122 |
| 2020-07-07 11:24:20 | postgre | 123001233 |
If you want to extract a unique config for every row in the config query result then try the rows to fields transformation.
Query B:
## Convert field type
| Time | Job | Errors |
| ------------------- | ------- | ------ |
| 2020-07-07 11:34:20 | node | 15 |
| 2020-07-07 11:24:20 | postgre | 5 |
This transformation changes the field type of the specified field.
Here is the result after applying the Merge transformation.
- **Field -** Select from available fields
- **as -** Select the FieldType to convert to
- **Numeric -** attempts to make the values numbers
- **String -** will make the values strings
- **Time -** attempts to parse the values as time
- Will show an option to specify a DateFormat as input by a string like yyyy-mm-dd or DD MM YYYY hh:mm:ss
- **Boolean -** will make the values booleans
| Time | Job | Errors | Uptime |
| ------------------- | ------- | ------ | --------- |
| 2020-07-07 11:34:20 | node | 15 | 25260122 |
| 2020-07-07 11:24:20 | postgre | 5 | 123001233 |
For example the following query could be modified by selecting the time field, as Time, and Date Format as YYYY.
| Time | Mark | Value |
| ---------- | ----- | ----- |
| 2017-07-01 | above | 25 |
| 2018-08-02 | below | 22 |
| 2019-09-02 | below | 29 |
| 2020-10-04 | above | 22 |
The result:
| Time | Mark | Value |
| ------------------- | ----- | ----- |
| 2017-01-01 00:00:00 | above | 25 |
| 2018-01-01 00:00:00 | below | 22 |
| 2019-01-01 00:00:00 | below | 29 |
| 2020-01-01 00:00:00 | above | 22 |
## Filter data by name
@ -143,272 +120,6 @@ In the example below, the panel has three queries (A, B, C). I removed the B que
> **Note:** This transformation is not available for Graphite because this data source does not support correlating returned data with queries.
## Organize fields
Use this transformation to rename, reorder, or hide fields returned by the query.
> **Note:** This transformation only works in panels with a single query. If your panel has multiple queries, then you must either apply an Outer join transformation or remove the extra queries.
Grafana displays a list of fields returned by the query. You can:
- Change field order by hovering your cursor over a field. The cursor turns into a hand and then you can drag the field to its new place.
- Hide or show a field by clicking the eye icon next to the field name.
- Rename fields by typing a new name in the **Rename <field>** box.
In the example below, I hid the value field and renamed Max and Min.
{{< figure src="/static/img/docs/transformations/organize-fields-stat-example-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
## Join by field (outer join)
Use this transformation to join multiple time series from a result set by field.
This transformation is especially useful if you want to combine queries so that you can calculate results from the fields.
In the example below, I have a template query displaying time series data from multiple servers in a table visualization. I can only view the results of one query at a time.
{{< figure src="/static/img/docs/transformations/join-fields-before-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
I applied a transformation to join the query results using the time field. Now I can run calculations, combine, and organize the results in this new table.
{{< figure src="/static/img/docs/transformations/join-fields-after-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
## Add field from calculation
Use this transformation to add a new field calculated from two other fields. Each transformation allows you to add one new field.
- **Mode -** Select a mode:
- **Reduce row -** Apply selected calculation on each row of selected fields independently.
- **Binary option -** Apply basic math operation(sum, multiply, etc) on values in a single row from two selected fields.
- **Field name -** Select the names of fields you want to use in the calculation for the new field.
- **Calculation -** If you select **Reduce row** mode, then the **Calculation** field appears. Click in the field to see a list of calculation choices you can use to create the new field. For information about available calculations, refer to the [Calculation list]({{< relref "../calculations-list.md" >}}).
- **Operation -** If you select **Binary option** mode, then the **Operation** fields appear. These fields allow you to do basic math operations on values in a single row from two selected fields. You can also use numerical values for binary operations.
- **Alias -** (Optional) Enter the name of your new field. If you leave this blank, then the field will be named to match the calculation.
- **Replace all fields -** (Optional) Select this option if you want to hide all other fields and display only your calculated field in the visualization.
In the example below, I added two fields together and named them Sum.
{{< figure src="/static/img/docs/transformations/add-field-from-calc-stat-example-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
## Labels to fields
This transformation changes time series results that include labels or tags into to a table structure where each label keys and values
are included in the table result. The labels can be displayed either as columns or as row values.
Given a query result of two time series:
- Series 1: labels Server=Server A, Datacenter=EU
- Series 2: labels Server=Server B, Datacenter=EU
In "Columns" mode, the result looks like this:
| Time | Server | Datacenter | Value |
| ------------------- | -------- | ---------- | ----- |
| 2020-07-07 11:34:20 | Server A | EU | 1 |
| 2020-07-07 11:34:20 | Server B | EU | 2 |
In "Rows" mode, the result has a table for each series and show each label value like this:
| label | value |
| ---------- | -------- |
| Server | Server A |
| Datacenter | EU |
| label | value |
| ---------- | -------- |
| Server | Server B |
| Datacenter | EU |
### Value field name
If you selected Server as the **Value field name**, then you would get one field for every value of the Server label.
| Time | Datacenter | Server A | Server B |
| ------------------- | ---------- | -------- | -------- |
| 2020-07-07 11:34:20 | EU | 1 | 2 |
### Merging behavior
The labels to fields transformer is internally two separate transformations. The first acts on single series and extracts labels to fields. The second is the [merge](#merge) transformation that joins all the results into a single table. The merge transformation tries to join on all matching fields. This merge step is required and cannot be turned off.
To illustrate this, here is an example where you have two queries that return time series with no overlapping labels.
- Series 1: labels Server=ServerA
- Series 2: labels Datacenter=EU
This will first result in these two tables:
| Time | Server | Value |
| ------------------- | ------- | ----- |
| 2020-07-07 11:34:20 | ServerA | 10 |
| Time | Datacenter | Value |
| ------------------- | ---------- | ----- |
| 2020-07-07 11:34:20 | EU | 20 |
After merge:
| Time | Server | Value | Datacenter |
| ------------------- | ------- | ----- | ---------- |
| 2020-07-07 11:34:20 | ServerA | 10 | |
| 2020-07-07 11:34:20 | | 20 | EU |
## Sort by
This transformation will sort each frame by the configured field, When `reverse` is checked, the values will return in
the opposite order.
## Group by
This transformation groups the data by a specified field (column) value and processes calculations on each group. Click to see a list of calculation choices. For information about available calculations, refer to the [List of calculations]({{< relref "../calculations-list.md" >}}).
Here's an example of original data.
| Time | Server ID | CPU Temperature | Server Status |
| ------------------- | --------- | --------------- | ------------- |
| 2020-07-07 11:34:20 | server 1 | 80 | Shutdown |
| 2020-07-07 11:34:20 | server 3 | 62 | OK |
| 2020-07-07 10:32:20 | server 2 | 90 | Overload |
| 2020-07-07 10:31:22 | server 3 | 55 | OK |
| 2020-07-07 09:30:57 | server 3 | 62 | Rebooting |
| 2020-07-07 09:30:05 | server 2 | 88 | OK |
| 2020-07-07 09:28:06 | server 1 | 80 | OK |
| 2020-07-07 09:25:05 | server 2 | 88 | OK |
| 2020-07-07 09:23:07 | server 1 | 86 | OK |
This transformation goes in two steps. First you specify one or multiple fields to group the data by. This will group all the same values of those fields together, as if you sorted them. For instance if we group by the Server ID field, then it would group the data this way:
| Time | Server ID | CPU Temperature | Server Status |
| ------------------- | -------------- | --------------- | ------------- |
| 2020-07-07 11:34:20 | **server 1** | 80 | Shutdown |
| 2020-07-07 09:28:06 | **server 1** | 80 | OK |
| 2020-07-07 09:23:07 | **server 1** | 86 | OK |
| 2020-07-07 10:32:20 | server 2 | 90 | Overload |
| 2020-07-07 09:30:05 | server 2 | 88 | OK |
| 2020-07-07 09:25:05 | server 2 | 88 | OK |
| 2020-07-07 11:34:20 | **_server 3_** | 62 | OK |
| 2020-07-07 10:31:22 | **_server 3_** | 55 | OK |
| 2020-07-07 09:30:57 | **_server 3_** | 62 | Rebooting |
All rows with the same value of Server ID are grouped together.
After choosing which field you want to group your data by, you can add various calculations on the other fields, and apply the calculation to each group of rows. For instance, we could want to calculate the average CPU temperature for each of those servers. So we can add the _mean_ calculation applied on the CPU Temperature field to get the following:
| Server ID | CPU Temperature (mean) |
| --------- | ---------------------- |
| server 1 | 82 |
| server 2 | 88.6 |
| server 3 | 59.6 |
And we can add more than one calculation. For instance:
- For field Time, we can calculate the _Last_ value, to know when the last data point was received for each server
- For field Server Status, we can calculate the _Last_ value to know what is the last state value for each server
- For field Temperature, we can also calculate the _Last_ value to know what is the latest monitored temperature for each server
We would then get :
| Server ID | CPU Temperature (mean) | CPU Temperature (last) | Time (last) | Server Status (last) |
| --------- | ---------------------- | ---------------------- | ------------------- | -------------------- |
| server 1 | 82 | 80 | 2020-07-07 11:34:20 | Shutdown |
| server 2 | 88.6 | 90 | 2020-07-07 10:32:20 | Overload |
| server 3 | 59.6 | 62 | 2020-07-07 11:34:20 | OK |
This transformation allows you to extract some key information out of your time series and display them in a convenient way.
## Concatenate fields
This transformation combines all fields from all frames into one result. Consider:
Query A:
| Temp | Uptime |
| ---- | ------- |
| 15.4 | 1230233 |
Query B:
| AQI | Errors |
| --- | ------ |
| 3.2 | 5 |
After you concatenate the fields, the data frame would be:
| Temp | Uptime | AQI | Errors |
| ---- | ------- | --- | ------ |
| 15.4 | 1230233 | 3.2 | 5 |
## Convert field type
This transformation changes the field type of the specified field.
- **Field -** Select from available fields
- **as -** Select the FieldType to convert to
- **Numeric -** attempts to make the values numbers
- **String -** will make the values strings
- **Time -** attempts to parse the values as time
- Will show an option to specify a DateFormat for the input field like yyyy-mm-dd or DD MM YYYY hh:mm:ss
- **Boolean -** will make the values booleans
- **JSON -** attempts to parse the values as JSON, potentially resulting in complex objects or arrays
For example the following query could be modified by:
- selecting the time field as Time, and Input format as YYYY
- selecting the JSON field as JSON
| Time | Mark | Value | JSON |
| ---------- | ----- | ----- | -------- |
| 2017-07-01 | above | 25 | "[0, 1]" |
| 2018-08-02 | below | 22 | "[2, 3]" |
| 2019-09-02 | below | 29 | "[4, 5]" |
| 2020-10-04 | above | 22 | "[6, 7]" |
The result:
| Time | Mark | Value | JSON |
| ------------------- | ----- | ----- | ------ |
| 2017-01-01 00:00:00 | above | 25 | [0, 1] |
| 2018-01-01 00:00:00 | below | 22 | [2, 3] |
| 2019-01-01 00:00:00 | below | 29 | [4, 5] |
| 2020-01-01 00:00:00 | above | 22 | [6, 7] |
## Series to rows
> **Note:** This transformation is available in Grafana 7.1+.
Use this transformation to combine the result from multiple time series data queries into one single result. This is helpful when using the table panel visualization.
The result from this transformation will contain three columns: Time, Metric, and Value. The Metric column is added so you easily can see from which query the metric originates from. Customize this value by defining Label on the source query.
In the example below, we have two queries returning time series data. It is visualized as two separate tables before applying the transformation.
Query A:
| Time | Temperature |
| ------------------- | ----------- |
| 2020-07-07 11:34:20 | 25 |
| 2020-07-07 10:31:22 | 22 |
| 2020-07-07 09:30:05 | 19 |
Query B:
| Time | Humidity |
| ------------------- | -------- |
| 2020-07-07 11:34:20 | 24 |
| 2020-07-07 10:32:20 | 29 |
| 2020-07-07 09:30:57 | 33 |
Here is the result after applying the Series to rows transformation.
| Time | Metric | Value |
| ------------------- | ----------- | ----- |
| 2020-07-07 11:34:20 | Temperature | 25 |
| 2020-07-07 11:34:20 | Humidity | 22 |
| 2020-07-07 10:32:20 | Humidity | 29 |
| 2020-07-07 10:31:22 | Temperature | 22 |
| 2020-07-07 09:30:57 | Humidity | 33 |
| 2020-07-07 09:30:05 | Temperature | 19 |
## Filter data by value
This transformation allows you to filter your data directly in Grafana and remove some data points from your query result. You have the option to include or exclude data that match one or more conditions you define. The conditions are applied on a selected field.
@ -470,6 +181,233 @@ In the example above we chose **Match all** because we wanted to include the row
Conditions that are invalid or incompletely configured are ignored.
## Group by
This transformation groups the data by a specified field (column) value and processes calculations on each group. Click to see a list of calculation choices. For information about available calculations, refer to the [List of calculations]({{< relref "./reference-calculation-types.md" >}}).
Here's an example of original data.
| Time | Server ID | CPU Temperature | Server Status |
| ------------------- | --------- | --------------- | ------------- |
| 2020-07-07 11:34:20 | server 1 | 80 | Shutdown |
| 2020-07-07 11:34:20 | server 3 | 62 | OK |
| 2020-07-07 10:32:20 | server 2 | 90 | Overload |
| 2020-07-07 10:31:22 | server 3 | 55 | OK |
| 2020-07-07 09:30:57 | server 3 | 62 | Rebooting |
| 2020-07-07 09:30:05 | server 2 | 88 | OK |
| 2020-07-07 09:28:06 | server 1 | 80 | OK |
| 2020-07-07 09:25:05 | server 2 | 88 | OK |
| 2020-07-07 09:23:07 | server 1 | 86 | OK |
This transformation goes in two steps. First you specify one or multiple fields to group the data by. This will group all the same values of those fields together, as if you sorted them. For instance if we group by the Server ID field, then it would group the data this way:
| Time | Server ID | CPU Temperature | Server Status |
| ------------------- | -------------- | --------------- | ------------- |
| 2020-07-07 11:34:20 | **server 1** | 80 | Shutdown |
| 2020-07-07 09:28:06 | **server 1** | 80 | OK |
| 2020-07-07 09:23:07 | **server 1** | 86 | OK |
| 2020-07-07 10:32:20 | server 2 | 90 | Overload |
| 2020-07-07 09:30:05 | server 2 | 88 | OK |
| 2020-07-07 09:25:05 | server 2 | 88 | OK |
| 2020-07-07 11:34:20 | **_server 3_** | 62 | OK |
| 2020-07-07 10:31:22 | **_server 3_** | 55 | OK |
| 2020-07-07 09:30:57 | **_server 3_** | 62 | Rebooting |
All rows with the same value of Server ID are grouped together.
After choosing which field you want to group your data by, you can add various calculations on the other fields, and apply the calculation to each group of rows. For instance, we could want to calculate the average CPU temperature for each of those servers. So we can add the _mean_ calculation applied on the CPU Temperature field to get the following:
| Server ID | CPU Temperature (mean) |
| --------- | ---------------------- |
| server 1 | 82 |
| server 2 | 88.6 |
| server 3 | 59.6 |
And we can add more than one calculation. For instance:
- For field Time, we can calculate the _Last_ value, to know when the last data point was received for each server
- For field Server Status, we can calculate the _Last_ value to know what is the last state value for each server
- For field Temperature, we can also calculate the _Last_ value to know what is the latest monitored temperature for each server
We would then get :
| Server ID | CPU Temperature (mean) | CPU Temperature (last) | Time (last) | Server Status (last) |
| --------- | ---------------------- | ---------------------- | ------------------- | -------------------- |
| server 1 | 82 | 80 | 2020-07-07 11:34:20 | Shutdown |
| server 2 | 88.6 | 90 | 2020-07-07 10:32:20 | Overload |
| server 3 | 59.6 | 62 | 2020-07-07 11:34:20 | OK |
This transformation allows you to extract some key information out of your time series and display them in a convenient way.
## Join by field (outer join)
Use this transformation to join multiple time series from a result set by field.
This transformation is especially useful if you want to combine queries so that you can calculate results from the fields.
In the example below, I have a template query displaying time series data from multiple servers in a table visualization. I can only view the results of one query at a time.
{{< figure src="/static/img/docs/transformations/join-fields-before-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
I applied a transformation to join the query results using the time field. Now I can run calculations, combine, and organize the results in this new table.
{{< figure src="/static/img/docs/transformations/join-fields-after-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
## Labels to fields
This transformation changes time series results that include labels or tags into a table where each label keys and values are included in the table result. The labels can be displayed either as columns or as row values.
Given a query result of two time series:
- Series 1: labels Server=Server A, Datacenter=EU
- Series 2: labels Server=Server B, Datacenter=EU
In "Columns" mode, the result looks like this:
| Time | Server | Datacenter | Value |
| ------------------- | -------- | ---------- | ----- |
| 2020-07-07 11:34:20 | Server A | EU | 1 |
| 2020-07-07 11:34:20 | Server B | EU | 2 |
In "Rows" mode, the result has a table for each series and show each label value like this:
| label | value |
| ---------- | -------- |
| Server | Server A |
| Datacenter | EU |
| label | value |
| ---------- | -------- |
| Server | Server B |
| Datacenter | EU |
## Merge
Use this transformation to combine the result from multiple queries into one single result. This is helpful when using the table panel visualization. Values that can be merged are combined into the same row. Values are mergeable if the shared fields contain the same data. For information, refer to [Table panel]({{< relref "../visualizations/table/_index.md" >}}).
In the example below, we have two queries returning table data. It is visualized as two separate tables before applying the transformation.
Query A:
| Time | Job | Uptime |
| ------------------- | ------- | --------- |
| 2020-07-07 11:34:20 | node | 25260122 |
| 2020-07-07 11:24:20 | postgre | 123001233 |
Query B:
| Time | Job | Errors |
| ------------------- | ------- | ------ |
| 2020-07-07 11:34:20 | node | 15 |
| 2020-07-07 11:24:20 | postgre | 5 |
Here is the result after applying the Merge transformation.
| Time | Job | Errors | Uptime |
| ------------------- | ------- | ------ | --------- |
| 2020-07-07 11:34:20 | node | 15 | 25260122 |
| 2020-07-07 11:24:20 | postgre | 5 | 123001233 |
## Organize fields
Use this transformation to rename, reorder, or hide fields returned by the query.
> **Note:** This transformation only works in panels with a single query. If your panel has multiple queries, then you must either apply an Outer join transformation or remove the extra queries.
Grafana displays a list of fields returned by the query. You can:
- Change field order by hovering your cursor over a field. The cursor turns into a hand and then you can drag the field to its new place.
- Hide or show a field by clicking the eye icon next to the field name.
- Rename fields by typing a new name in the **Rename <field>** box.
In the example below, I hid the value field and renamed Max and Min.
{{< figure src="/static/img/docs/transformations/organize-fields-stat-example-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
### Value field name
If you selected Server as the **Value field name**, then you would get one field for every value of the Server label.
| Time | Datacenter | Server A | Server B |
| ------------------- | ---------- | -------- | -------- |
| 2020-07-07 11:34:20 | EU | 1 | 2 |
### Merging behavior
The labels to fields transformer is internally two separate transformations. The first acts on single series and extracts labels to fields. The second is the [merge](#merge) transformation that joins all the results into a single table. The merge transformation tries to join on all matching fields. This merge step is required and cannot be turned off.
To illustrate this, here is an example where you have two queries that return time series with no overlapping labels.
- Series 1: labels Server=ServerA
- Series 2: labels Datacenter=EU
This will first result in these two tables:
| Time | Server | Value |
| ------------------- | ------- | ----- |
| 2020-07-07 11:34:20 | ServerA | 10 |
| Time | Datacenter | Value |
| ------------------- | ---------- | ----- |
| 2020-07-07 11:34:20 | EU | 20 |
After merge:
| Time | Server | Value | Datacenter |
| ------------------- | ------- | ----- | ---------- |
| 2020-07-07 11:34:20 | ServerA | 10 | |
| 2020-07-07 11:34:20 | | 20 | EU |
## Reduce
The _Reduce_ transformation applies a calculation to each field in the frame and return a single value. Time fields are removed when applying this transformation.
Consider the input:
Query A:
| Time | Temp | Uptime |
| ------------------- | ---- | ------- |
| 2020-07-07 11:34:20 | 12.3 | 256122 |
| 2020-07-07 11:24:20 | 15.4 | 1230233 |
Query B:
| Time | AQI | Errors |
| ------------------- | --- | ------ |
| 2020-07-07 11:34:20 | 6.5 | 15 |
| 2020-07-07 11:24:20 | 3.2 | 5 |
The reduce transformer has two modes:
- **Series to rows -** Creates a row for each field and a column for each calculation.
- **Reduce fields -** Keeps the existing frame structure, but collapses each field into a single value.
For example, if you used the **First** and **Last** calculation with a **Series to rows** transformation, then
the result would be:
| Field | First | Last |
| ------ | ------ | ------- |
| Temp | 12.3 | 15.4 |
| Uptime | 256122 | 1230233 |
| AQI | 6.5 | 3.2 |
| Errors | 15 | 5 |
The **Reduce fields** with the **Last** calculation,
results in two frames, each with one row:
Query A:
| Temp | Uptime |
| ---- | ------- |
| 15.4 | 1230233 |
Query B:
| AQI | Errors |
| --- | ------ |
| 3.2 | 5 |
## Rename by regex
Use this transformation to rename parts of the query results using a regular expression and replacement pattern.
@ -484,14 +422,116 @@ With the transformation applied, you can see we are left with just the remainder
{{< figure src="/static/img/docs/transformations/rename-by-regex-after-7-3.png" class="docs-image--no-shadow" max-width= "1100px" >}}
## Rows to fields
The rows to fields transformation converts rows into separate fields. This can be useful as fields can be styled and configured individually. It can also use additional fields as sources for dynamic field configuration or map them to field labels. The additional labels can then be used to define better display names for the resulting fields.
This transformation includes a field table which lists all fields in the data returned by the config query. This table gives you control over what field should be mapped to each config property (the \*Use as\*\* option). You can also choose which value to select if there are multiple rows in the returned data.
This transformation requires:
- One field to use as the source of field names.
By default, the transform uses the first string field as the source. You can override this default setting by selecting **Field name** in the **Use as** column for the field you want to use instead.
- One field to use as the source of values.
By default, the transform uses the first number field as the source. But you can override this default setting by selecting **Field value** in the **Use as** column for the field you want to use instead.
Useful when visualizing data in:
- Gauge
- Stat
- Pie chart
### Map extra fields to labels
If a field does not map to config property Grafana will automatically use it as source for a label on the output field-
Example:
| Name | DataCenter | Value |
| ------- | ---------- | ----- |
| ServerA | US | 100 |
| ServerB | EU | 200 |
Output:
| ServerA (labels: DataCenter: US) | ServerB (labels: DataCenter: EU) |
| -------------------------------- | -------------------------------- |
| 10 | 20 |
The extra labels can now be used in the field display name provide more complete field names.
If you want to extract config from one query and appply it to another you should use the config from query results transformation.
### Example
Input:
| Name | Value | Max |
| ------- | ----- | --- |
| ServerA | 10 | 100 |
| ServerB | 20 | 200 |
| ServerC | 30 | 300 |
Output:
| ServerA (config: max=100) | ServerB (config: max=200) | ServerC (config: max=300) |
| ------------------------- | ------------------------- | ------------------------- |
| 10 | 20 | 30 |
As you can see each row in the source data becomes a separate field. Each field now also has a max config option set. Options like **Min**, **Max**, **Unit** and **Thresholds** are all part of field configuration and if set like this will be used by the visualization instead of any options manually configured in the panel editor options pane.
## Prepare time series
> **Note:** This transformation is available in Grafana 7.5.10+ and Grafana 8.0.6+.
Prepare time series transformation is useful when a data source returns time series data in a format that isn't supported by the panel you want to use. [Read more about the different data frame formats here]({{< relref "../../developers/plugins/data-frames.md" >}}).
Prepare time series transformation is useful when a data source returns time series data in a format that isn't supported by the panel you want to use. For more information about data frame formats, refer to [Data frames]({{< relref "../developers/plugins/data-frames.md" >}}).
This transformation helps you resolve this issue by converting the time series data from either the wide format to the long format or the other way around.
Select the `Multi-frame time series` option to transform the time series data frame from the wide to the long format.
Select the `Wide time series` option to transform the time series data frame from the long to the wide format.
## Series to rows
> **Note:** This transformation is available in Grafana 7.1+.
Use this transformation to combine the result from multiple time series data queries into one single result. This is helpful when using the table panel visualization.
The result from this transformation will contain three columns: Time, Metric, and Value. The Metric column is added so you easily can see from which query the metric originates from. Customize this value by defining Label on the source query.
In the example below, we have two queries returning time series data. It is visualized as two separate tables before applying the transformation.
Query A:
| Time | Temperature |
| ------------------- | ----------- |
| 2020-07-07 11:34:20 | 25 |
| 2020-07-07 10:31:22 | 22 |
| 2020-07-07 09:30:05 | 19 |
Query B:
| Time | Humidity |
| ------------------- | -------- |
| 2020-07-07 11:34:20 | 24 |
| 2020-07-07 10:32:20 | 29 |
| 2020-07-07 09:30:57 | 33 |
Here is the result after applying the Series to rows transformation.
| Time | Metric | Value |
| ------------------- | ----------- | ----- |
| 2020-07-07 11:34:20 | Temperature | 25 |
| 2020-07-07 11:34:20 | Humidity | 22 |
| 2020-07-07 10:32:20 | Humidity | 29 |
| 2020-07-07 10:31:22 | Temperature | 22 |
| 2020-07-07 09:30:57 | Humidity | 33 |
| 2020-07-07 09:30:05 | Temperature | 19 |
## Sort by
This transformation will sort each frame by the configured field, When `reverse` is checked, the values will return in the opposite order.

View File

@ -1,51 +0,0 @@
+++
title = "Repeat panels or rows"
keywords = ["grafana", "templating", "documentation", "guide", "template", "variable", "repeat"]
aliases = ["/docs/grafana/latest/variables/repeat-panels-or-rows/"]
weight = 800
+++
# Repeat panels or rows
{{< docs/shared "panels/repeat-panels-intro.md" >}}
Template variables can be very useful to dynamically change your queries across a whole dashboard. If you want
Grafana to dynamically create new panels or rows based on what values you have selected, you can use the _Repeat_ feature.
## Grafana Play examples
You can see examples in the following dashboards:
- [Prometheus repeat](https://play.grafana.org/d/000000036/prometheus-repeat)
- [Repeated Rows Dashboard](https://play.grafana.org/d/000000153/repeat-rows)
## Repeating panels
If you have a variable with `Multi-value` or `Include all value` options enabled you can choose one panel and have Grafana repeat that panel
for every selected value. You find the _Repeat_ feature under the _General tab_ in panel edit mode.
The `direction` controls how the panels will be arranged.
By choosing `horizontal` the panels will be arranged side-by-side. Grafana will automatically adjust the width
of each repeated panel so that the whole row is filled. Currently, you cannot mix other panels on a row with a repeated
panel.
Set `Max per row` to tell grafana how many panels per row you want at most. It defaults to _4_ if you don't set anything.
By choosing `vertical` the panels will be arranged from top to bottom in a column. The width of the repeated panels will be the same as of the first panel (the original template) being repeated.
Only make changes to the first panel (the original template). To have the changes take effect on all panels you need to trigger a dynamic dashboard re-build.
You can do this by either changing the variable value (that is the basis for the repeat) or reload the dashboard.
> **Note:** Repeating panels require variables to have one or more items selected; you cannot repeat a panel zero times to hide it.
## Repeating rows
As seen above with the panels you can also repeat rows if you have variables set with `Multi-value` or
`Include all value` selection option.
To enable this feature you need to first add a new _Row_ using the _Add Panel_ menu. Then by hovering the row title and
clicking on the cog button, you will access the `Row Options` configuration panel. You can then select the variable
you want to repeat the row for.
It may be a good idea to use a variable in the row title as well.

View File

@ -0,0 +1,11 @@
+++
title = "Modify visualization text and background colors"
aliases = ["/docs/grafana/next/panels/thresholds/", "/docs/sources/panels/specify-thresholds/"]
weight = 300
+++
# Modify visualization text and background colors
Use thresholds to set the color of a visualization text and background.
{{< section >}}

View File

@ -0,0 +1,26 @@
+++
title = "About thresholds"
weight = 10
aliases = ["/docs/sources/panels/specify-thresholds/about-thresholds/"]
+++
# About thresholds
Thresholds set the color of either the value text or the background based on conditions that you define.
There are two types of thresholds:
- **Absolute** thresholds are defined based on a number. For example, 80 on a scale of 1 to 150.
- **Percentage** thresholds are defined relative to minimum or maximum. For example, 80 percent.
You can apply thresholds to most, but not all, visualizations.
## Default thresholds
On visualizations that support it, Grafana sets default threshold values of:
- 80 = red
- Base = green
- Mode = Absolute
The **Base** value represents minus infinity. It is generally the “good” color.

View File

@ -0,0 +1,29 @@
+++
title = "Add a threshold"
weight = 20
aliases = ["/docs/sources/panels/specify-thresholds/add-a-threshold/"]
+++
# Add a threshold
You can add as many thresholds to a panel as you want. Grafana automatically sorts thresholds from highest value to lowest.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To add a threshold**:
1. Edit the panel to which you want to add a threshold.
1. On the panel display options, locate the **Thresholds** section.
1. Click **+ Add threshold**.
Grafana adds a threshold value and color.
1. Accept the recommendations or edit the threshold.
- **Edit color:** To select a color, click the color dot.
- **Edit number:** To change the threshold value, click in the field and enter a number.
1. Select a **Threshold mode**.
Threshold mode applies to all thresholds on this panel.
1. In the **Show thresholds** drop-down, select a threshold display option.
1. Click **Save**.

View File

@ -0,0 +1,32 @@
+++
title = "Add a threshold to a legacy graph panel"
weight = 40
aliases = ["/docs/sources/panels/specify-thresholds/add-threshold-to-graph/"]
+++
# Add a threshold to a legacy graph panel
In the Graph panel visualization, thresholds enable you to add lines or sections to a graph to make it easier to recognize when the graph crosses a threshold.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To add a threshold to a graph panel**:
1. Navigate to the graph panel to which you want to add a threshold.
1. On the **Panel** tab, click **Thresholds**.
1. Click **Add threshold**.
1. Complete the following fields:
- **T1 -** Both values are required to display a threshold.
- **lt** or **gt** - Select **lt** for less than or **gt** for greater than to indicate what the threshold applies to.
- **Value -** Enter a threshold value. Grafana draws a threshold line along the Y-axis at that value.
- **Color -** Choose a condition that corresponds to a color, or define your own color.
- **custom -** You define the fill color and line color.
- **critical -** Fill and line color are red.
- **warning -** Fill and line color are yellow.
- **ok -** Fill and line color are green.
- **Fill -** Controls whether the threshold fill is displayed.
- **Line -** Controls whether the threshold line is displayed.
- **Y-Axis -** Choose **left** or **right**.
1. Click **Save** to save the changes in the dashboard.

View File

@ -0,0 +1,20 @@
+++
title = "Delete a threshold"
weight = 30
aliases = ["/docs/sources/panels/specify-thresholds/delete-a-threshold/"]
+++
# Delete a threshold
Delete a threshold when it is no longer relevant to your business operations. When you delete a threshold, the system removes the threshold from all visualizations that include the threshold.
## Before you begin
- [Add a threshold]({{< relref "./add-a-threshold.md" >}}).
**To delete a threshold**:
1. Navigate to the panel to which you want to add a threshold.
1. Click the **Field** tab. (Or **Panel** tab for a graph panel.)
1. Click the trash can icon next to the threshold you want to remove.
1. Click **Save** to save the changes in the dashboard.

View File

@ -1,67 +0,0 @@
+++
title = "Thresholds"
weight = 440
+++
# Thresholds
Thresholds set the color of either the value text or the background depending on conditions that you define.
You can define thresholds one of two ways:
- **Absolute** thresholds are defined based on a number. For example, 80 on a scale of 1 to 150.
- **Percentage** thresholds are defined relative to minimum or maximum. For example, 80 percent.
You can apply thresholds to most, but not all, visualizations.
## Default thresholds
On visualizations that support it, Grafana sets default threshold values of:
- 80 = red
- Base = green
- Mode = Absolute
The **Base** value represents minus infinity. It is generally the “good” color.
## Add a threshold
You can add as many thresholds to a panel as you want. Grafana automatically sorts thresholds from highest value to lowest.
1. Navigate to the panel you want to add a threshold to.
1. Open the category **Thresholds** in the right side options pane.
1. Click **Add threshold**.
1. Grafana adds a threshold with suggested numerical and color values.
1. Accept the recommendations or edit the new threshold.
- **Edit color:** Click the color dot you wish to change and then select a new color.
- **Edit number:** Click the number you wish to change and then enter a new number.
- **Thresholds mode -** Click the mode to change it for all thresholds on this panel.
1. Click **Save** to save the changes in the dashboard.
## Add a threshold to a Graph (old) panel
In the Graph panel visualization, thresholds allow you to add arbitrary lines or sections to the graph to make it easier to see when the graph crosses a particular threshold.
1. Navigate to the graph panel you want to add a threshold to.
1. On the Panel tab, click **Thresholds**.
1. Click **Add threshold**.
1. Fill in as many fields as you want. Only the **T1** fields are required.
- **T1 -** Both values are required to display a threshold.
- **lt** or **gt** - Select **lt** for less than or **gt** for greater than to indicate what the threshold applies to.
- **Value -** Enter a threshold value. Grafana draws a threshold line along the Y-axis at that value.
- **Color -** Choose a condition that corresponds to a color, or define your own color.
- **custom -** You define the fill color and line color.
- **critical -** Fill and line color are red.
- **warning -** Fill and line color are yellow.
- **ok -** Fill and line color are green.
- **Fill -** Controls whether the threshold fill is displayed.
- **Line -** Controls whether the threshold line is displayed.
- **Y-Axis -** Choose **left** or **right**.
1. Click **Save** to save the changes in the dashboard.
## Delete a threshold
1. Navigate to the panel you want to add a threshold to.
1. Click the **Field** tab. (Or **Panel** tab for a graph panel.)
1. Click the trash can icon next to the threshold you want to remove.
1. Click **Save** to save the changes in the dashboard.

View File

@ -0,0 +1,20 @@
+++
title = "Transform data"
aliases = ["/docs/grafana/latest/panels/transformations/", "/docs/grafana/latest/panels/transformations/config-from-query/", "/docs/grafana/latest/panels/transformations/rows-to-fields/", "/docs/grafana/latest/panels/transformations/apply-transformations/", "/docs/sources/panels/transform-data/"]
weight = 500
+++
# Transform data
Transformations are a powerful way to manipulate data returned by a query before the system applies a visualization.
With transformations, you can:
- Rename fields
- Join time series data
- Perform mathematical operations across queries
- Use the output of one transformation as the input to another transformation
This section includes the following topics:
{{< section >}}

View File

@ -0,0 +1,31 @@
+++
title = "About transformations"
weight = 10
aliases = ["/docs/sources/panels/transform-data/about-transformation/"]
+++
# About transformations
Transformations process the result set of a query before its passed on for visualization. Using transformations, you can:
- Rename fields
- Join time series data
- Perform mathematical operations across queries
- Use the output of one transformation as the input to another transformation
For users that rely on multiple views of the same dataset, transformations offer an efficient method of creating and maintaining numerous dashboards.
You can also use the output of one transformation as the input to another transformation, which results in a performance gain.
> Sometimes the system cannot graph transformed data. When that happens, click the `Table view` toggle above the visualization to switch to a table view of the data. This can help you understand the final result of your transformations.
## Transformation types
Grafana provides a number of ways that you can transform data. For a complete list of transformations, refer to
[Reference: Transformation functions]({{< relref "../reference-transformation-functions.md" >}}).
## Order of transformations
When there are multiple transformations, Grafana applies them in the order they are listed. Each transformation creates a result set that then passes on to the next transformation in the processing pipeline.
The order in which Grafana applies transformations directly impacts the results. For example, if you use a Reduce transformation to condense all the results of one column into a single value, then you can only apply transformations to that single value.

View File

@ -0,0 +1,36 @@
+++
title = "Apply a transformation to data"
weight = 20
aliases = ["/docs/sources/panels/transform-data/apply-transformation-to-data/"]
+++
# Apply a transformation function to data
The following steps guide you in applying a transformation to data. This documentation does not include steps for each type of transformation. For a complete list of transformations, refer to [Reference: Transformation functions]({{< relref "../reference-transformation-functions.md" >}}).
## Before you begin
- [Add a query]({{< relref "../query-a-data-source/add-a-query.md" >}}).
**To apply a transformation function to data**:
1. Navigate to the panel where you want to add one or more transformations.
1. Click the panel title and then click **Edit**.
1. Click the **Transform** tab.
1. Click a transformation.
A transformation row appear where you configure the transformation options. For more information about how to configure a transformation, refer to [Reference: Transformation functions]({{< relref "../reference-transformation-functions.md" >}}).
For information about available calculations, refer to [Reference: Calculations]({{< relref "../reference-calculation-types.md" >}}).
1. To apply another transformation, click **Add transformation**.
This transformation acts on the result set returned by the previous transformation.
{{< figure src="/static/img/docs/transformations/transformations-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
## Options
- **Config query**: Select the query that returns the data you want to use as configuration.
- **Apply to**: Select what fields or series to apply the configuration to.
- **Apply to options**: Usually a field type or field name regex depending on what option you selected in **Apply to**.

View File

@ -0,0 +1,13 @@
+++
title = "Debug a transformation"
weight = 30
aliases = ["/docs/sources/panels/transform-data/debug-transformation/"]
+++
# Debug a transformation
To see the input and the output result sets of the transformation, click the bug icon on the right side of the transformation row.
The input and output results sets can help you debug a transformation.
{{< figure src="/static/img/docs/transformations/debug-transformations-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}

View File

@ -0,0 +1,19 @@
+++
title = "Delete a transformation"
weight = 40
aliases = ["/docs/sources/panels/transform-data/delete-transformation/"]
+++
# Delete a transformation
We recommend that you remove transformations that you don't need. When you delete a transformation, you remove the data from the visualization.
## Before you begin
- Identify all dashboards that rely on the transformation and inform impacted dashboard users.
**To delete a transformation**:
1. Open a panel for editing.
1. Click the **Transform** tab.
1. Click the trash icon next to the transformation you want to delete.

View File

@ -1,45 +0,0 @@
+++
title = "Transformations"
weight = 350
+++
# Transformations
Transformations process the result set of a query before its passed on for visualization. They allow you to rename fields, join separate time series together, do math across queries, and more. For users, with numerous dashboards or with a large volume of queries, the ability to reuse the query result from one panel in another panel can be a huge performance gain.
The transformations feature is accessible from the **Transform** tab of the Grafana panel editor.
Transformations sometimes result in data that cannot be graphed. When that happens, click the `Table view` toggle above the visualization to switch to a table view of the data. This can help you understand
the final result of your transformations.
## Order of transformations
In case there are multiple transformations, Grafana applies them in the exact sequence in which they are listed. Each transformation creates a new result set that is passed onto the next transformation in the pipeline for processing.
The order in which transformations are applied can make a huge difference in how your results look. For example, if you use a Reduce transformation to condense all the results of one column into a single value, then you can only apply transformations to that single value.
## Prerequisites
Before you can configure and apply transformations:
- You must have entered a query that return data. For more information on queries, refer to [Queries]({{< relref "../queries.md" >}}).
## List of transformations
- [Add field from calculation]({{< relref "./types-options.md#add-field-from-calculation" >}})
- [Concatenate fields]({{< relref "./types-options.md#concatenate-fields" >}})
- [Config from query results]({{< relref "./config-from-query.md" >}})
- [Convert field type]({{< relref "./types-options.md#convert-field-type" >}})
- [Filter data by name]({{< relref "./types-options.md#filter-data-by-name" >}})
- [Filter data by query]({{< relref "./types-options.md#filter-data-by-query" >}})
- [Filter data by value]({{< relref "./types-options.md#filter-data-by-value" >}})
- [Group by]({{< relref "./types-options.md#group-by" >}})
- [Labels to fields]({{< relref "./types-options.md#labels-to-fields" >}})
- [Merge]({{< relref "./types-options.md#merge" >}})
- [Organize fields]({{< relref "./types-options.md#organize-fields" >}})
- [Outer join]({{< relref "./types-options.md#join-by-field-outer-join" >}})
- [Reduce]({{< relref "./types-options.md#reduce" >}})
- [Rename by regex]({{< relref "./types-options.md#rename-by-regex" >}})
- [Rows to fields]({{< relref "./rows-to-fields" >}})
- [Series to rows]({{< relref "./types-options.md#series-to-rows" >}})
- [Sort by]({{< relref "./types-options.md#sort-by" >}})

View File

@ -1,33 +0,0 @@
+++
title = "Apply a transformation"
weight = 1
+++
# Apply transformations
You can apply transformations from the Transform tab of the Grafana panel editor, which is located next to the Queries tab. See also, [Debug transformations](#debug-transformations).
To apply a transformation:
1. Navigate to the panel where you want to add one or more transformations.
1. Click the panel title and then click **Edit**.
1. Click the **Transform** tab.
1. Click a transformation to select it.
A transformation row displays. You can configure the transformation options here. For more information, refer to [Transformation types and options]({{< relref "types-options.md" >}}).
1. Click **Add transformation** to apply another transformation.
This next transformation acts on the result set returned by the previous transformation.
{{< figure src="/static/img/docs/transformations/transformations-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}
## Delete a transformation
To remove a transformation that is no longer needed, click the trash can icon.
## Debug transformations
To see the input and the output result sets of the transformation, click the bug icon on the right side of the transformation row
Grafana displays the transformation debug view below the transformation row.
{{< figure src="/static/img/docs/transformations/debug-transformations-7-0.png" class="docs-image--no-shadow" max-width= "1100px" >}}

View File

@ -1,69 +0,0 @@
+++
title = "Config from query results"
weight = 300
+++
# Config from query results transform
> **Note:** This is a new beta transformation introduced in v8.1.
This transformation allow you select one query and from it extract [standard options]({{< relref "../standard-options.md" >}}) like **Min**, **Max**, **Unit** and **Thresholds** and apply it to other query results. This enables dynamic query driven visualization configuration.
If you want to extract a unique config for every row in the config query result then try the [Rows to fields]({{< relref "./rows-to-fields" >}}) transformation instead.
### Options
- **Config query**: Select the query that returns the data you want to use as configuration.
- **Apply to**: Select what fields or series to apply the configuration to.
- **Apply to options**: Usually a field type or field name regex depending on what option you selected in **Apply to**.
### Field mapping table
This transformation includes a field table which lists all fields in the data returned by the config query. This table gives you control over what field should be mapped to each config property (the \*Use as\*\* option). You can also choose which value to select if there are multiple rows in the returned data.
## Example
Input[0] (From query: A, name: ServerA)
| Time | Value |
| ------------- | ----- |
| 1626178119127 | 10 |
| 1626178119129 | 30 |
Input[1] (From query: B)
| Time | Value |
| ------------- | ----- |
| 1626178119127 | 100 |
| 1626178119129 | 100 |
Output (Same as Input[0] but now with config on the Value field)
| Time | Value (config: Max=100) |
| ------------- | ----------------------- |
| 1626178119127 | 10 |
| 1626178119129 | 30 |
As you can see each row in the source data becomes a separate field. Each field now also has a max config option set. Options like min, max, unit and thresholds are all part of field configuration and if set like this will be used by the visualization instead of any options manually configured in the panel editor options pane.
## Value mappings
You can also transform a query result into value mappings. This is is a bit different as here every row in the config query result will be used to define a single value mapping row. See example below.
Config query result:
| Value | Text | Color |
| ----- | ------ | ----- |
| L | Low | blue |
| M | Medium | green |
| H | High | red |
In the field mapping specify:
| Field | Use as | Select |
| ----- | ----------------------- | ---------- |
| Value | Value mappings / Value | All values |
| Text | Value mappings / Text | All values |
| Color | Value mappings / Ciolor | All values |
Grafana will build the value mappings from you query result and apply it the the real data query results. You should see values being mapped and colored according to the config query results.

View File

@ -1,72 +0,0 @@
+++
title = "Rows to fields"
weight = 300
+++
# Rows to fields transform
> **Note:** This is a new beta transformation introduced in v8.1.
This transforms rows into separate fields. This can be useful as fields can be styled and configured individually, something rows cannot. It can also use additional fields as sources for dynamic field configuration or map them to field labels. The additional labels can then be used to define better display names for the resulting fields.
Useful when visualizing data in:
- Gauge
- Stat
- Pie chart
If you want to extract config from one query and appply it to another you should use the [Config from query results]({{< relref "./config-from-query.md" >}}) transformation instead.
## Example
Input:
| Name | Value | Max |
| ------- | ----- | --- |
| ServerA | 10 | 100 |
| ServerB | 20 | 200 |
| ServerC | 30 | 300 |
Output:
| ServerA (config: max=100) | ServerB (config: max=200) | ServerC (config: max=300) |
| ------------------------- | ------------------------- | ------------------------- |
| 10 | 20 | 30 |
As you can see each row in the source data becomes a separate field. Each field now also has a max config option set. Options like **Min**, **Max**, **Unit** and **Thresholds** are all part of field configuration and if set like this will be used by the visualization instead of any options manually configured in the panel editor options pane.
## Configuration
To do this transformation Grafana needs to know how to use each field in the input data. The UI options for this transform shows you all fields and **Use as** option to tell Grafana how to use the field.
### The name field (required)
This transformation needs one field to use as the source of field names. By default the transform will use the first string field for this. But you can override this default behavior by selecting **Field name** in the **Use as** column for the field you want to use instead.
### The value field (required)
This transformation needs one field to use as the source of values. By default the transform will use the first number field for this. But you can override this default behavior by selecting **Field value** in the **Use as** column for the field you want to use instead.
### Map extra fields to config
You can map extra fields to configuration like min, max, unit and threshold. If the field name maps directly
to one of these config fields Grafana will handle this mapping automatically.
### Map extra fields to labels
If a field does not map to config property Grafana will automatically use it as source for a label on the output field-
Example:
| Name | DataCenter | Value |
| ------- | ---------- | ----- |
| ServerA | US | 100 |
| ServerB | EU | 200 |
Output:
| ServerA (labels: DataCenter: US) | ServerB (labels: DataCenter: EU) |
| -------------------------------- | -------------------------------- |
| 10 | 20 |
The extra labels can now be used in the field display name provide more complete field names.

View File

@ -1,155 +0,0 @@
+++
title = "Value mappings"
weight = 450
+++
# Value mappings
Value mapping concept allow you to replace values or ranges in your visualizations with words or emojis.
Values mapped via value mappings will skip the unit formatting. This means that a text value mapped to a numerical value will not be formatted using the configured unit.
![Value mappings example](/static/img/docs/value-mappings/value-mappings-example-8-0.png)
If value mappings are present in a panel, then Grafana displays a summary in the side pane of the panel editor.
> **Note:** The new value mappings are not compatible with some visualizations, such as Graph (old), Text, and Heatmap.
## Value mapping examples
Value mappings are displayed differently in different visualizations.
### Time series example
Here's an example showing a Time series visualization with value mappings. Value mapping colors are not applied to this visualization, but the display text is shown on the axis.
![Value mappings time series example](/static/img/docs/value-mappings/value-mappings-summary-example-8-0.png)
### Stat example
Here's an example showing a Stat visualization with value mappings. You might want to hide the sparkline so it doesn't interfere with the values. Value mapping text colors are applied.
![Value mappings stat example](/static/img/docs/value-mappings/value-mappings-stat-example-8-0.png)
### Bar gauge example
Here's an example showing a Bar gauge visualization with value mappings. The value mapping colors are applied to the text but not the gauges.
![Value mappings bar gauge example](/static/img/docs/value-mappings/value-mappings-bar-gauge-example-8-0.png)
### Table example
Here's an example showing a Table visualization with value mappings. If you want value mapping colors displayed on the table, then set the cell display mode to **Color text** or **Color background**.
![Value mappings table example](/static/img/docs/value-mappings/value-mappings-table-example-8-0.png)
## Value mappings fields
This section describes options in the Value mappings user interface.
> **Note:** Display text and Color are both optional. If you want to only assign colors to the text values, then you can leave the display text empty and the original value is displayed.
### Condition
This column lists the type of condition a value mapping is triggered by and the values.
You can map values to three different conditions:
- **Value** maps text values to a color or different display text. For example, if a value is `10`, I want Grafana to display **Perfection!** rather than the number.
- **Range** maps numerical ranges to a display text and color. For example, if a value is within a certain range, I want Grafana to display **Low** or **High** rather than the number.
- **Regex** maps regular expressions to replacement text and a color. For example, if a value is 'www.example.com', I want Grafana to display just **www**, truncating the domain.
- **Special** maps special values like `Null`, `NaN` (not a number), and boolean values like `true` and `false` to a display text and color. For example, if Grafana encounters a `null`, I want Grafana to display **N/A**.
You can also use the dots on the left as a "handle" to drag and reorder value mappings in the list.
### Display text
The _display text_ is what Grafana displays instead of a number when the listed condition is met.
You can enter any Ascii character or emoji in this field.
### Color
You can select a color to for Grafana to display the value mapping text in.
- **Set color -** Click **Set color** to see a range of recommended colors. Click **Custom** to choose your own color.
- **Text color -** The primary text color for the current theme, i.e. white in dark theme and black in light theme.
- **Transparent -** Makes the color transparent so that the value mapping color shows whatever color is behind it, such as a panel background color.
![Set color](/static/img/docs/value-mappings/set-color-8-0.png)
### Copy icon
Click the copy icon in the value mapping row that you want to copy.
### Trash icon
Click the trash can icon to delete a value mapping. Once deleted, you cannot recover it.
## Map a value
Create a mapping for a single value.
![Map a value](/static/img/docs/value-mappings/map-value-8-0.png)
1. [Open the panel editor]({{< relref "./panel-editor.md#open-the-panel-editor" >}}).
1. In the Value mappings section of the side pane, click **Add value mappings**.
1. Click **Add a new mapping** and then select **Value**.
1. Enter the exact value for Grafana to match.
1. (Optional) Enter display text.
1. (Optional) Set the color.
1. Click **Update** to save the value mapping.
## Map a range
Create a mapping for a range of values.
![Map a range](/static/img/docs/value-mappings/map-range-8-0.png)
1. [Open the panel editor]({{< relref "./panel-editor.md#open-the-panel-editor" >}}).
1. In the Value mappings section of the side pane, click **Add value mappings**.
1. Click **Add a new mapping** and then select **Range**.
1. Enter the beginning and ending values in the range for Grafana to match.
1. (Optional) Enter display text.
1. (Optional) Set the color.
1. Click **Update** to save the value mapping.
## Map a regular expression
Create a mapping based on a regular expression.
![Map a regular expression](/static/img/docs/value-mappings/map-regex-8-0.png)
1. [Open the panel editor]({{< relref "./panel-editor.md#open-the-panel-editor" >}}).
1. In the Value mappings section of the side pane, click **Add value mappings**.
1. Click **Add a new mapping** and then select **Regex**.
1. Enter the regular expression pattern for Grafana to match.
1. (Optional) Enter display text, which can include items such as $1 for replacements.
1. (Optional) Set the color.
1. Click **Update** to save the value mapping.
## Map a special value
Create a mapping for a special value.
![Map a value](/static/img/docs/value-mappings/map-special-value-8-0.png)
1. [Open the panel editor]({{< relref "./panel-editor.md#open-the-panel-editor" >}}).
1. In the Value mappings section of the side pane, click **Add value mappings**.
1. Click **Add a new mapping** and then select **Special**.
1. Select the special value for Grafana to match. Options include:
- Null
- NaN (Not a Number)
- Null + NaN
- True
- False
- Empty
1. (Optional) Enter display text.
1. (Optional) Set the color.
1. Click **Update** to save the value mapping.
## Edit a value mapping
1. [Open the panel editor]({{< relref "./panel-editor.md#open-the-panel-editor" >}}).
1. In the Value mappings section of the side pane, click **Edit value mappings**.
1. Make any necessary changes in the fields and then click **Update**.

View File

@ -0,0 +1,13 @@
+++
title = "Working with Grafana panels"
aliases = ["/docs/grafana/latest/panels/panel-editor/", "/docs/grafana/latest/panels/add-a-panel/", "/docs/grafana/latest/panels/standard-options/", "/docs/grafana/latest/panels/panel-options/", "/docs/grafana/latest/panels/legend-options/", "/docs/sources/panels/working-with-panels/"]
weight = 100
+++
# Working with Grafana panels
A Grafana panel is the user interface you use to define a data source query, and transform and format data that appears in visualizations.
A panel editor includes a query builder and a series of options that you can use to transform data and add information to your panels.
{{< section >}}

View File

@ -0,0 +1,11 @@
+++
title = "Add a link to a panel"
aliases = ["/docs/sources/panels/working-with-panels/add-link-to-panel/"]
weight = 60
+++
# Add a link to a panel
{{< docs/shared "panels/panel-links-intro.md" >}}
For more information, refer to [Panel links]({{< relref "../../linking/panel-links.md" >}}).

View File

@ -0,0 +1,55 @@
+++
title = "Add a panel to a dashboard"
aliases = ["/docs/sources/panels/working-with-panels/add-panel/"]
weight = 20
+++
# Add a panel to a dashboard
Panels allow you to show your data in visual form. Each panel needs at least one query to display a visualization.
## Before you begin
- Ensure that you have the proper [organization role]({{< relref "../../permissions/organization_roles.md" >}}) or [permissions]({{< relref "../../permissions/_index.md" >}}).
- Identify the dashboard to which you want to add the panel.
- Understand the query language of the target data source.
- Ensure that data source for which you are writing a query has been added. For more information about adding a data source, refer to [Add a data source]({{< relref "../../datasources/add-a-data-source.md" >}}) if you need instructions.
**To add a panel to a dashboard**:
1. Navigate to the dashboard to which you want to add a panel.
1. Click the **Add panel** icon.
![](/static/img/docs/panels/add-panel-icon-7-0.png)
1. Click **Add an empty panel**.
Grafana creates an empty time-series panel and selects the default data source.
1. In the first line of the **Query** tab, click the drop-down list and select a data source.
1. Write or construct a query in the query language of your data source.
For more information about data sources, refer to [Data sources]({{< relref "../../datasources/_index.md" >}}) for specific guidelines.
1. In the Visualization list, select a visualization type.
Grafana displays a preview of your query results with the visualization applied.
![](/static/img/docs/panel-editor/select-visualization-8-0.png)
For more information about individual visualizations, refer to [Visualizations options]({{< relref "../../visualizations/_index.md" >}}).
1. Refer to the following documentation for ways you adjust panel settings.
While not required, most visualizations need some adjustment before they properly display the information that you need.
- [Format data using value mapping]({{< relref "../format-data/about-value-mapping.md" >}})
- [Visualization-specific options]({{< relref "../../visualizations/_index.md" >}})
- [Override field values]({{< relref "../override-field-values/about-field-overrides.md" >}})
- [Specify thresholds to set the color of visualization text and background]({{< relref "../specify-thresholds/about-thresholds.md" >}})
- [Apply color to series and fields]({{< relref "./apply-color-to-series.md" >}})
1. Add a note to describe the visualization (or describe your changes) and then click **Save** in the upper-right corner of the page.
Notes can be helpful if you need to revert the dashboard to a previous version.

View File

@ -0,0 +1,33 @@
+++
title = "Add a title and description to a panel"
aliases = ["/docs/sources/panels/working-with-panels/add-title-and-description/"]
weight = 30
+++
# Add a title and description to a panel
Add a title and description to a panel to share with users any important information about the visualization. For example, use the description to document the purpose of the visualization.
## Before you begin:
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To add a title and description to a panel**:
1. Open a panel.
1. In the panel display options pane, locate the **Panel options** section.
1. Enter a **Title**.
Text entered in this field is displayed at the top of your panel in the panel editor and in the dashboard.
You can use [variables you have defined]({{< relref "../../variables/_index.md" >}}) in either field, but not [global variables]({{< relref "../../variables/variable-types/global-variables.md" >}}).
1. Write a description of the panel and the data you are displaying.
Text entered in this field is displayed in a tooltip in the upper left corner of the panel.
You can use [variables you have defined]({{< relref "../../variables/_index.md" >}}) in either field, but not [global variables]({{< relref "../../variables/variable-types/global-variables.md" >}}).
![](/static/img/docs/panels/panel-options-8-0.png)

View File

@ -0,0 +1,38 @@
+++
title = "Apply color to series and fields"
aliases = ["/docs/sources/panels/working-with-panels/apply-color-to-series/"]
weight = 50
+++
# Apply color to series and fields
In addition to specifying color based on thresholds, you can configure the color of series and field data. The color options and their effect on the visualization depends on the visualization you are working with. Some visualizations have different color options.
You can specify a single color, or select a continuous (gradient) color schemes, based on a value.
Continuous color interpolates a color using the percentage of a value relative to min and max.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To apply color to series and fields**:
1. In panel display options, scroll to the **Standard options** or **override** section.
1. Click the **Standard options Color scheme** drop-down, and select one of the following palettes:
<div class="clearfix"></div>
| Color mode | Description |
| ------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- | --- |
| **Single color** | Specify a single color, useful in an override rule |
| **From thresholds** | Informs Grafana to take the color from the matching threshold |
| **Classic palette** | Grafana will assign color by looking up a color in a palette by series index. Useful for Graphs and pie charts and other categorical data visualizations |
| **Green-Yellow-Red (by value)** | Continuous color scheme |
| **Blue-Yellow-Red (by value)** | Continuous color scheme |
| **Blues (by value)** | Continuous color scheme (panel background to blue) |
| **Reds (by value)** | Continuous color scheme (panel background color to blue) |
| **Greens (by value)** | Continuous color scheme (panel background color to blue) |
| **Purple (by value)** | Continuous color scheme (panel background color to blue) | . |
{{< figure src="/static/img/docs/v73/color_scheme_dropdown.png" max-width="350px" caption="Color scheme" class="pull-right" >}}

View File

@ -0,0 +1,92 @@
+++
title = "Configure a legend"
aliases = ["/docs/sources/panels/working-with-panels/configure-legend/"]
weight = 70
+++
# Configure a legend
A panel includes a legend that you can use to interpret data displayed in a visualization. Each legend option adds context and clarity to the data illustrated in a visualization.
## Isolate series data in a visualization
Visualizations can often be visually complex, and include many data series. You can simplify the view by removing series data from the visualization, which isolates the data you want to see. Grafana automatically creates a new override in the **Override** tab.
When you apply your changes, the visualization changes appear to all users of the panel.
### Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To isolate series data in a visualization**:
1. Open the panel.
1. In the legend, click the label of the series you want to isolate.
The system removes from view all other series data.
1. To incrementally add series data to an isolated series, press the **Ctrl** or **Command** key and click the label of the series you want to add.
1. To revert back to the default view that includes all data, click any series label twice.
1. To save your changes so that they appear to all viewers of the panel, click **Apply**.
This topic currently applies to the following visualizations:
- [Bar chart]({{< relref "../../visualizations/bar-chart.md" >}})
- [Histogram]({{< relref "../../visualizations/histogram.md" >}})
- [Pie chart]({{< relref "../../visualizations/pie-chart-panel.md" >}})
- [State timeline]({{< relref "../../visualizations/state-timeline.md" >}})
- [Status history]({{< relref "../../visualizations/status-history.md" >}})
- [Time series]({{< relref "../../visualizations/time-series/_index.md" >}})
## Add values to a legend
As way to add more context to a visualization, you can add series data values to a legend. You can add as many values as you'd like; after you apply your changes, you can horizontally scroll the legend to see all values.
### Before you begin
- Add a panel
**To add values to a legend**:
1. Open a panel.
1. In the panel display options pane, locate the **Legend** section.
1. In the **Legend values** field, select the values you want to appear in the legend.
1. Click **Apply** to save your changes are navigate back to the dashboard.
![Toggle series visibility](/static/img/docs/legend/legend-series-toggle-7-5.png)
## Change a series color
By default, Grafana specifies the color of your series data, which you can change.
### Before you begin
- Add a panel
**To change a series color, perform the following steps**:
1. Open the panel.
1. In the legend, click the color bar associated with the series.
1. Select a pre-set color or a custom color from the color palette.
1. Click **Apply** to save your changes are navigate back to the dashboard.
![Change legend series color](/static/img/docs/legend/legend-series-color-7-5.png)
## Sort series
Change legend mode to **Table** and choose [calculations]({{< relref "../reference-calculation-types.md" >}}) to be displayed in the legend. Click the calculation name header in the legend table to sort the values in the table in ascending or descending order.
The sort order affects the positions of the bars in the Bar chart panel as well as the order of stacked series in the Time series and Bar chart panels.
> **Note:** This feature is only supported in these panels: Bar chart, Histogram, Time series, XY Chart.
![Sort legend series](/static/img/docs/legend/legend-series-sort-8-3.png).

View File

@ -0,0 +1,21 @@
+++
title = "Download query results"
aliases = ["/docs/sources/panels/working-with-panels/download-query-results/"]
weight = 110
+++
# Download query results
Grafana generates a text (.txt) file that contains the results of a query, which you can download.
## Before you begin
- [Add a query]({{< relref "../query-a-data-source/add-a-query.md" >}}).
**To download query results**:
1. Open the panel inspector.
1. Inspect the query results.
1. Click **Download**.

View File

@ -0,0 +1,31 @@
+++
title = "Format a standard field"
aliases = ["/docs/sources/panels/working-with-panels/format-standard-fields/"]
weight = 40
+++
# Format a standard field
The data model used in Grafana, namely the [data frame]({{< relref "../../developers/plugins/data-frames.md" >}}), is a columnar-oriented table structure that unifies both time series and table query results. Each column within this structure is called a _field_. A field can represent a single time series or table column.
Field options allow you to change how the data is displayed in your visualizations. Options and overrides that you apply do not change the data, they change how Grafana displays the data. When you change an option, it is applied to all fields, meaning all series or columns. For example, if you change the unit to percentage, then all fields with numeric values are displayed in percentages.
For a complete list of field formatting options, refer to [Reference: Standard field definitions]({{< relref "../reference-standard-field-definitions.md" >}}).
> You can apply standard options to most built-in Grafana panels. Some older panels and community panels that have not updated to the new panel and data model will be missing either all or some of these field options.
## Before you begin
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To format a standard field**:
1. Open a dashboard, click the panel title, and click **Edit**.
1. In the panel display options pane, locate the **Standard options** section.
1. Select the standard options you want to apply.
For more information about standard options, refer to [Reference: Standard field definitions]({{< relref "../reference-standard-field-definitions/index.md" >}}).
1. To preview your change, click outside of the field option box you are editing or press **Enter**.

View File

@ -0,0 +1,25 @@
+++
title = "Navigate the Grafana Inspector panel"
aliases = ["/docs/sources/panels/working-with-panels/navigate-inspector-panel/"]
weight = 90
+++
# Navigate the Grafana Inspector panel
The panel inspector helps you understand and troubleshoot your panels. You can inspect the raw data for any Grafana panel, export that data to a comma-separated values (CSV) file, view query requests, and export panel and data JSON.
> **Note:** Not all panel types include all tabs. For example, dashboard list panels do not have raw data to inspect, so they do not display the Stats, Data, or Query tabs.
The panel inspector consists of the following options:
1. The panel inspector displays Inspect: <NameOfPanelBeingInspected> at the top of the pane. Click the arrow in the upper right corner to expand or reduce the pane.
2. **Data tab -** Shows the raw data returned by the query with transformations applied. Field options such as overrides and value mappings are not applied by default.
3. **Stats tab -** Shows how long your query takes and how much it returns.
4. **JSON tab -** Allows you to view and copy the panel JSON, panel data JSON, and data frame structure JSON. This is useful if you are provisioning or administering Grafana.
5. **Query tab -** Shows you the requests to the server sent when Grafana queries the data source.
6. **Error tab -** Shows the error. Only visible when query returns error.

View File

@ -0,0 +1,40 @@
+++
title = "Navigate the Grafana panel editor"
weight = 10
aliases = ["/docs/sources/panels/working-with-panels/navigate-panel-editor/"]
+++
# Navigate the Grafana panel editor
This page describes the parts of the Grafana panel editor.
1. Panel header: The header section lists the dashboard in which the panel appears and the following controls:
- **Dashboard settings (gear) icon -** Click to access the dashboard settings.
- **Discard -** Discards changes you have made to the panel since you last saved the dashboard.
- **Save -** Saves changes you made to the panel.
- **Apply -** Applies changes you made and closes the panel editor, returning you to the dashboard. You will have to save the dashboard to persist the applied changes.
2. Visualization preview: The visualization preview section contains the following options:
- **Table view -** Convert any visualization to a table so that you can see the data. Table views are useful for troubleshooting.
- **Fill -** The visualization preview fills the available space. If you change the width of the side pane or height of the bottom pane the visualization changes to fill the available space.
- **Actual -** The visualization preview will have the exact size as the size on the dashboard. If not enough space is available, the visualization will scale down preserving the aspect ratio.
- **Time range controls -** For more information, refer to [Time range controls]({{< relref "../../dashboards/time-range-controls.md" >}}).
3. Data section: The data section contains tabs where you enter queries, transform your data, and create alert rules (if applicable).
- **Query tab -** Select your data source and enter queries here. For more information, refer to [Add a query]({{< relref "../query-a-data-source/add-a-query.md" >}}).
- **Transform tab -** Apply data transformations. For more information, refer to [Transform data]({{< relref "../transform-data/_index.md" >}}).
- **Alert tab -** Write alert rules. For more information, refer to [Overview of Grafana 8 alerting]({{< relref "../../alerting/unified-alerting/_index.md" >}}).
4. Panel display options: The display options section contains tabs where you configure almost every aspect of your data visualization, including:
- [Apply color to series and fields]({{< relref "./apply-color-to-series.md" >}})
- [Format a standard field]({{< relref "./format-standard-fields.md" >}})
- [Add a title and description to a panel]({{< relref "./add-title-and-description.md" >}})
> Not all options are available for each visualization.
{{< figure src="/static/img/docs/panel-editor/panel-editor-8-0.png" class="docs-image--no-shadow" max-width="1500px" >}}

View File

@ -0,0 +1,31 @@
+++
title = "Organize a dashboard"
aliases = ["/docs/sources/panels/working-with-panels/organize-dashboard/"]
weight = 80
+++
# Organize a dashboard
You can place any panel in any location you want and controls its size. The changes you make impact other users of the dashboard.
## Before you begin
- Add two or more panels
- Ensure that you sign in with Editor permissions
**To organize a dashboard**:
1. Hover your cursor over the panel, and click-and-drag the panel to its new location.
1. To resize a penal, click the zoom in (+) and zoom out (-) icons.
![](/static/img/docs/animated_gifs/drag_drop.gif)
## Tips and shortcuts
- Click the graph title and in the dropdown menu quickly duplicate the panel.
- Click the colored icon in the legend to change a series color or the y-axis.
- Click series name in the legend to hide series.
- Ctrl/Shift/Meta + click legend name to hide other series.
- Hover your cursor over a panel and press `e` to open the panel editor.
- Hover your cursor over a panel and press `v` to open the panel in full screen view..

View File

@ -0,0 +1,25 @@
+++
title = "View a panel JSON model"
aliases = ["/docs/sources/panels/working-with-panels/view-json-model/"]
weight = 100
+++
# View a panel JSON model
Explore and export panel, panel data, and data frame JSON models.
## Before you begin:
- [Add a panel to a dashboard]({{< relref "../working-with-panels/add-panel.md" >}}).
**To view a panel JSON model**:
1. Open the panel inspector and then click the **JSON** tab or in the panel menu click **Inspect > Panel JSON**.
1. In Select source, choose one of the following options:
- **Panel JSON -** Displays a JSON object representing the panel.
- **Panel data -** Displays a JSON object representing the data that was passed to the panel.
- **DataFrame structure -** Displays the raw result set with transformations, field configuration, and overrides configuration applied.
1. You can expand or collapse portions of the JSON to explore it, or you can click **Copy to clipboard** and paste the JSON in another application.

View File

@ -21,7 +21,7 @@ For more information, refer to [Enable debug logging in Grafana CLI]({{< relref
Order of transformations matters. If the final data output from multiple transformations looks wrong, try changing the transformation order. Each transformation transforms data returned by the previous transformation, not the original raw data.
For more information, refer to [Debug transformations]({{< relref "../panels/transformations/apply-transformations.md" >}}).
For more information, refer to [Debug a transformation]({{< relref "../panels/transform-data/debug-transformation.md" >}}).
## Text missing with server-side image rendering (RPM-based Linux)

View File

@ -19,7 +19,7 @@ The most common problems are related to the query and response from your data so
like a bug or visualization issue in Grafana, it is almost always a problem with the data source query or
the data source response. Start by inspecting your panel query and response.
For more information, refer to [Inspect a panel]({{< relref "../panels/inspect-panel.md" >}}).
For more information, refer to [Inspect request and response data]({{< relref "../panels/query-a-data-source/inspect-request-and-response-data.md" >}}).
## My query is slow

View File

@ -8,7 +8,7 @@ aliases = ["/docs/grafana/latest/panels/visualizations/"]
Grafana offers a variety of visualizations to support different use cases. This section of the documentation highlights the built-in panels, their options and typical usage.
> **Note:** If you are unsure which visualization to pick, Grafana can provide visualization suggestions based on the panel query. When you select a visualization, Grafana will show a preview with that visualization applied. For more information, see the [add a panel]({{< relref "../panels/add-a-panel.md" >}}) documentation.
> **Note:** If you are unsure which visualization to pick, Grafana can provide visualization suggestions based on the panel query. When you select a visualization, Grafana will show a preview with that visualization applied. For more information, see the [add a panel]({{< relref "../panels/working-with-panels/add-panel.md" >}}) documentation.
- Graphs & charts
- [Time series]({{< relref "./time-series/_index.md" >}}) is the default and main Graph visualization.

View File

@ -76,7 +76,7 @@ Controls the fill opacity bars.
### Gradient mode
Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard [color scheme]({{< relref "../panels/standard-options.md#color-scheme" >}}) field option.
Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard color scheme field option.
Gradient appearance is influenced by the **Fill opacity** setting.
@ -98,7 +98,7 @@ Gradient color is generated based on the hue of the line color.
### Legend calculations
Choose which of the [standard calculations]({{< relref "../panels/calculations-list.md">}}) to show in the legend. You can have more than one.
Choose which of the [standard calculations]({{< relref "../panels/reference-calculation-types.md">}}) to show in the legend. You can have more than one.
## Text size
@ -148,4 +148,4 @@ Set a **Soft min** or **soft max** option for better control of Y-axis limits. B
**Soft min** and **soft max** settings can prevent blips from turning into mountains when the data is mostly flat, and hard min or max derived from standard min and max field options can prevent intermittent spikes from flattening useful detail by clipping the spikes past a defined point.
You can set standard min/max options to define hard limits of the Y-axis. For more information, refer to [Standard field options]({{< relref "../panels/standard-options.md#max" >}}).
You can set standard min/max options to define hard limits of the Y-axis. For more information, refer to [Standard field options]({{< relref "../panels/reference-standard-field-definitions.md#max" >}}).

View File

@ -26,7 +26,7 @@ Choose how Grafana displays your data.
Show a calculated value based on all rows.
- **Calculation -** Select a reducer function that Grafana will use to reduce many fields to a single value. For a list of available calculations, refer to [List of calculations]({{< relref "../panels/calculations-list.md" >}}).
- **Calculation -** Select a reducer function that Grafana will use to reduce many fields to a single value. For a list of available calculations, refer to [List of calculations]({{< relref "../panels/reference-calculation-types.md" >}}).
- **Fields -** Select the fields display in the panel.
#### All values

View File

@ -24,7 +24,7 @@ Choose how Grafana displays your data.
Show a calculated value based on all rows.
- **Calculation -** Select a reducer function that Grafana will use to reduce many fields to a single value. For a list of available calculations, refer to [List of calculations]({{< relref "../panels/calculations-list.md" >}}).
- **Calculation -** Select a reducer function that Grafana will use to reduce many fields to a single value. For a list of available calculations, refer to [List of calculations]({{< relref "../panels/reference-calculation-types.md" >}}).
- **Fields -** Select the fields display in the panel.
#### All values

View File

@ -16,9 +16,9 @@ The graph panel can render metrics as a line, a path of dots, or a series of bar
Graph visualizations allow you to apply:
- [Alerts]({{< relref "../alerting/_index.md" >}}) - This is the only type of visualization that allows you to set alerts.
- [Data transformations]({{< relref "../panels/transformations/_index.md" >}})
- [Field overrides]({{< relref "../panels/field-overrides.md" >}})
- [Thresholds]({{< relref "../panels/thresholds.md" >}})
- [Transform data]({{< relref "../panels/transform-data/apply-transformation-to-data.md" >}})
- [Add a field override]({{< relref "../panels/override-field-values/add-a-field-override.md" >}})
- [Add a threshold]({{< relref "../panels/specify-thresholds/add-a-threshold.md" >}})
## Display options

View File

@ -42,7 +42,7 @@ Controls the fill opacity bars.
### Gradient mode
Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard [color scheme]({{< relref "../panels/standard-options.md#color-scheme" >}}) field option.
Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard [color scheme]({{< relref "../panels/working-with-panels/apply-color-to-series.md" >}}) field option.
Gradient display is influenced by the **Fill opacity** setting.
@ -64,4 +64,4 @@ Gradient color is generated based on the hue of the line color.
### Legend calculations
Choose a [standard calculations]({{< relref "../panels/calculations-list.md">}}) to show in the legend. You can select more than one.
Choose a [standard calculations]({{< relref "../panels/reference-calculation-types.md">}}) to show in the legend. You can select more than one.

Some files were not shown because too many files have changed in this diff Show More