Docs: Sync all doc changes in main to v8.0.x (#35333)
This commit is contained in:
Torkel Ödegaard
@@ -16,30 +16,34 @@ Panels allow you to show your data in visual form. This topic walks you through
|
||||
|
||||
1. Click **Add an empty panel**.
|
||||
|
||||
Grafana creates an empty graph panel with your default data source selected.
|
||||
Grafana creates an empty time series panel with your default data source selected.
|
||||
|
||||
## 2. Edit panel settings
|
||||
|
||||
While not required, we recommend that you add a helpful title and description to your 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" >}}).
|
||||
|
||||
|
||||
|
||||
**Panel title -** Text entered in this field is displayed at the top of your panel in the panel editor and in the dashboard.
|
||||
|
||||
**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.
|
||||
|
||||
## 3. Write a query
|
||||
## 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.
|
||||
|
||||
## 4. Choose a visualization type
|
||||
## 3. Choose a visualization type
|
||||
|
||||
In the Visualization section of the Panel tab, click a visualization type. Grafana displays a preview of your query results with that visualization applied.
|
||||
In the Visualization list, click a visualization type. Grafana displays a preview of your query results with that visualization applied.
|
||||
|
||||
For more information about individual visualizations, refer to [Visualizations]({{< relref "visualizations/_index.md" >}}).
|
||||
|
||||
|
||||
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
|
||||
|
||||
@@ -54,7 +58,5 @@ Our Grafana Fundamentals tutorial is a great place to start, or you can learn mo
|
||||
- Learn more about [panel editor]({{< relref "panel-editor.md" >}}) options.
|
||||
- Add more [queries]({{< relref "queries.md" >}}).
|
||||
- [Transform]({{< relref "transformations/_index.md" >}}) your data.
|
||||
- [Configure]({{< relref "field-options/_index.md" >}}) how your results are displayed in the visualization.
|
||||
|
||||
- If you made a graph panel, set up an [alert]({{< relref "../alerting/_index.md" >}}).
|
||||
- Set up an [alert]({{< relref "../alerting/_index.md" >}}).
|
||||
- Create [templates and variables]({{< relref "../variables/_index.md" >}}).
|
||||
|
||||
@@ -0,0 +1,110 @@
|
||||
+++
|
||||
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.
|
||||
|
||||
|
||||
|
||||
## 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
|
||||
|
||||
Let’s 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
|
||||
|
||||
Let’s 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% |
|
||||
@@ -1,7 +1,7 @@
|
||||
+++
|
||||
title = "Legend options"
|
||||
aliases = ["/docs/grafana/latest/panels/visualizations/panel-legend/"]
|
||||
weight = 500
|
||||
weight = 950
|
||||
+++
|
||||
|
||||
# Legend options
|
||||
|
||||
@@ -7,9 +7,11 @@ weight = 200
|
||||
|
||||
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-7-0.png" class="docs-image--no-shadow" max-width="1500px" >}}
|
||||
{{< figure src="/static/img/docs/panel-editor/panel-editor-8-0.png" class="docs-image--no-shadow" max-width="1500px" >}}
|
||||
|
||||
## Open the Panel editor
|
||||
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_:
|
||||
|
||||
@@ -17,12 +19,6 @@ There are several ways to access the panel editor, also called the **Edit Panel*
|
||||
- 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.
|
||||
|
||||
## Resize panel editor sections
|
||||
|
||||
Drag to resize sections of the panel editor. If the side pane becomes too narrow, then the Panel, Field, and Overrides tabs change to a dropdown list.
|
||||
|
||||
{{< figure src="/static/img/docs/panel-editor/resize-panel-editor-panels-7-0.gif" class="docs-image--no-shadow" max-width="600px" >}}
|
||||
|
||||
## 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.
|
||||
@@ -44,8 +40,9 @@ On the right side of the header are the following options:
|
||||
|
||||
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-7-0.png" class="docs-image--no-shadow" max-width="1200px" >}}
|
||||
{{< 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.
|
||||
@@ -55,20 +52,35 @@ The visualization preview section contains viewing options, time range controls,
|
||||
|
||||
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-7-0.png" class="docs-image--no-shadow" max-width="1200px" >}}
|
||||
{{< 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/create-alerts.md" >}}).
|
||||
- **Alert tab -** Write alert rules. For more information, refer to [Create alerts]({{< relref "../alerting/old-alerting/create-alerts.md" >}}).
|
||||
|
||||
### Panel and field options (side pane)
|
||||
### Panel display options (side pane)
|
||||
|
||||
The section contains tabs where you control almost every aspect of how your data is visualized. Not all tabs are available for each visualization.
|
||||
The section contains tabs where you configure almost every aspect of your data Visualization. Not all options are available for each visualization.
|
||||
|
||||
Features in these tabs are documented in the following topics:
|
||||
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.
|
||||
|
||||
- [Add a panel]({{< relref "add-a-panel.md" >}}) describes basic panel settings.
|
||||
- [Visualizations]({{< relref "visualizations/_index.md" >}}) display options vary widely. They are described in the individual visualization topic.
|
||||
- [Field options and overrides]({{< relref "field-options/_index.md" >}}) allow you to control almost every aspect of your visualization, including units, value mappings, and [Thresholds]({{< relref "thresholds.md" >}}).
|
||||
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" >}})
|
||||
|
||||
@@ -0,0 +1,83 @@
|
||||
+++
|
||||
title = "Library panels"
|
||||
weight = 400
|
||||
+++
|
||||
|
||||
# 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.
|
||||
|
||||
@@ -0,0 +1,38 @@
|
||||
+++
|
||||
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.
|
||||
|
||||
|
||||
|
||||
## 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" >}}).
|
||||
@@ -0,0 +1,51 @@
|
||||
+++
|
||||
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.
|
||||
@@ -1,6 +1,6 @@
|
||||
+++
|
||||
title = "Transformations"
|
||||
weight = 300
|
||||
weight = 350
|
||||
+++
|
||||
|
||||
# Transformations
|
||||
|
||||
@@ -3,14 +3,138 @@ title = "Value mappings"
|
||||
weight = 600
|
||||
+++
|
||||
|
||||
## Value mappings
|
||||
# Value mappings
|
||||
|
||||
Value mappings come in different types.
|
||||
Value mapping concept allow you to replace values or ranges in your visualizations with words or emojis.
|
||||
|
||||
* **Range** maps numerical ranges to a display text and color.
|
||||
* **Value** maps text values to a color or different display text.
|
||||
* **Special** maps special values like `Null`, `NaN` and boolean values like `true` and `false` to a display text and color.
|
||||
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.
|
||||
|
||||
The display text and color are both optional. If you only want to assign colors to text values you can leave the display text empty and the original value will be used for display.
|
||||
|
||||
|
||||
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.
|
||||
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.
|
||||
|
||||
|
||||
|
||||
### 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.
|
||||
|
||||
|
||||
|
||||
### 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.
|
||||
|
||||
|
||||
|
||||
### 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 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.
|
||||
- **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.
|
||||
|
||||
|
||||
|
||||
### 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.
|
||||
|
||||
|
||||
|
||||
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.
|
||||
|
||||
|
||||
|
||||
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 special value
|
||||
|
||||
Create a mapping for a special value.
|
||||
|
||||
|
||||
|
||||
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**.
|
||||
|
||||
@@ -1,12 +1,10 @@
|
||||
+++
|
||||
title = "Visualizations"
|
||||
weight = 300
|
||||
title = "Visualization options"
|
||||
weight = 400
|
||||
+++
|
||||
|
||||
# Visualizations
|
||||
# Visualization options
|
||||
|
||||
Grafana offers a variety of visualizations to suit different use cases. This section of the documentation lists the different visualizations available in Grafana and their unique display settings.
|
||||
|
||||
The default options and their unique display options are described in the pages in this section.
|
||||
Grafana offers a variety of visualizations to suit different use cases. This section of the documentation lists the different visualizations available in Grafana and their unique options.
|
||||
|
||||
You can add more panel types with [plugins]({{< relref "../../plugins/_index.md" >}}).
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
+++
|
||||
title = "Alert list panel"
|
||||
title = "Alert list"
|
||||
keywords = ["grafana", "alert list", "documentation", "panel", "alertlist"]
|
||||
aliases = ["/docs/grafana/latest/reference/alertlist/", "/docs/grafana/latest/features/panels/alertlist/"]
|
||||
weight = 100
|
||||
+++
|
||||
|
||||
# Alert list panel
|
||||
# Alert list
|
||||
|
||||
The Alert list panel allows you to display your dashboards alerts. You can configure the list to show current state or recent state changes. You can read more about alerts in [Alerts overview]({{< relref "../../alerting/_index.md" >}}).
|
||||
The Alert list allows you to display your dashboards alerts. You can configure the list to show current state or recent state changes. You can read more about alerts in [Alerts overview]({{< relref "../../alerting/_index.md" >}}).
|
||||
|
||||
{{< figure src="/static/img/docs/v45/alert-list-panel.png" max-width="850px" >}}
|
||||
|
||||
|
||||
@@ -0,0 +1,142 @@
|
||||
+++
|
||||
title = "Bar chart"
|
||||
description = "Bar chart visualization"
|
||||
keywords = ["grafana", "docs", "bar chart", "panel", "barchart"]
|
||||
weight = 170
|
||||
+++
|
||||
|
||||
# Bar chart
|
||||
|
||||
This panel visualization allows you to graph categorical data.
|
||||
|
||||
{{< figure src="/static/img/docs/bar-chart-panel/bar-chart-example-v8-0.png" max-width="1025px" caption="Bar chart example" >}}
|
||||
|
||||
## Supported data formats
|
||||
|
||||
Only one data frame is supported and it needs to have at least one string field that will be used as the category for an X or Y axis and one or more numerical fields.
|
||||
|
||||
Example:
|
||||
|
||||
| Browser | Market share |
|
||||
| ------- | ------------ |
|
||||
| Chrome | 50 |
|
||||
| IE | 17.5 |
|
||||
|
||||
If you have more than one numerical field the panel will show grouped bars.
|
||||
|
||||
### Visualizing time series or multiple result sets
|
||||
|
||||
If you have multiple time series or tables you first need to join them using a join or reduce transform. For example if you
|
||||
have multiple time series and you want to compare their last and max value add the **Reduce** transform and specify **Max** and **Last** as options under **Calculations**.
|
||||
|
||||
{{< figure src="/static/img/docs/bar-chart-panel/bar-chart-time-series-v8-0.png" max-width="1025px" caption="Bar chart time series example" >}}
|
||||
|
||||
## Bar chart options
|
||||
|
||||
Use these options to refine your visualization.
|
||||
|
||||
### Orientation
|
||||
|
||||
- **Auto** - Grafana decides the bar orientation based on what the panel dimensions.
|
||||
- **Horizontal** - Will make the X axis the category axis.
|
||||
- **Vertical** - Will make the Y axis the category axis.
|
||||
|
||||
### Show values
|
||||
|
||||
This controls whether values are shown on top or to the left of bars.
|
||||
|
||||
- **Auto** Values will be shown if there is space
|
||||
- **Always** Always show values.
|
||||
- **Never** Never show values.
|
||||
|
||||
### Group width
|
||||
|
||||
Controls the width of groups. 1 = max with, 0 = min width.
|
||||
|
||||
### Bar width
|
||||
|
||||
Controls the width of bars. 1 = Max width, 0 = Min width.
|
||||
|
||||
### Line width
|
||||
|
||||
Controls line width of the bars.
|
||||
|
||||
### Fill opacity
|
||||
|
||||
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 "../standard-options.md#color-scheme" >}}) field option.
|
||||
|
||||
Gradient appearance is influenced by the **Fill opacity** setting.
|
||||
|
||||
#### None
|
||||
|
||||
No gradient fill. This is the default setting.
|
||||
|
||||
#### Opacity
|
||||
|
||||
Transparency of the gradient is calculated based on the values on the y-axis. Opacity of the fill is increasing with the values on the Y-axis.
|
||||
|
||||
#### Hue
|
||||
|
||||
Gradient color is generated based on the hue of the line color.
|
||||
|
||||
{{< docs/shared "visualizations/tooltip-mode.md" >}}
|
||||
|
||||
{{< docs/shared "visualizations/legend-mode.md" >}}
|
||||
|
||||
### Legend calculations
|
||||
|
||||
Choose which of the [standard calculations]({{< relref "../calculations-list.md">}}) to show in the legend. You can have more than one.
|
||||
|
||||
## Text size
|
||||
|
||||
Enter a **Value** to change the size of the text on your bar chart.
|
||||
|
||||
## Axis
|
||||
|
||||
Use the following field settings to refine how your axes display.
|
||||
|
||||
Some field options will not affect the visualization until you click outside of the field option box you are editing or press Enter.
|
||||
|
||||
### Placement
|
||||
|
||||
Select the placement of the Y-axis.
|
||||
|
||||
#### Auto
|
||||
|
||||
Grafana automatically assigns Y-axis to the series. When there are two or more series with different units, then Grafana assigns the left axis to the first unit and right to the following units.
|
||||
|
||||
#### Left
|
||||
|
||||
Display all Y-axes on the left side.
|
||||
|
||||
#### Right
|
||||
|
||||
Display all Y-axes on the right side.
|
||||
|
||||
#### Hidden
|
||||
|
||||
Hide the Y-axes.
|
||||
|
||||
### Label
|
||||
|
||||
Set a Y-axis text label.
|
||||
|
||||
If you have more than one Y-axis, then you can give assign different labels with an override.
|
||||
|
||||
### Width
|
||||
|
||||
Set a fixed width of the axis. By default, Grafana dynamically calculates the width of an axis.
|
||||
|
||||
By setting the width of the axis, data whose axes types are different can share the same display proportions. This makes it easier to compare more than one graph’s worth of data because the axes are not shifted or stretched within visual proximity of each other.
|
||||
|
||||
### Soft min and soft max
|
||||
|
||||
Set a **Soft min** or **soft max** option for better control of Y-axis limits. By default, Grafana sets the range for the Y-axis automatically based on the dataset.
|
||||
|
||||
**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 "../standard-options.md#max" >}}).
|
||||
@@ -1,12 +1,12 @@
|
||||
+++
|
||||
title = "Bar gauge panel"
|
||||
description = "Bar gauge panel docs"
|
||||
title = "Bar gauge"
|
||||
description = "Bar gauge panel options"
|
||||
keywords = ["grafana", "bar", "bar gauge"]
|
||||
aliases =["/docs/grafana/latest/features/panels/bar_gauge/"]
|
||||
weight = 200
|
||||
+++
|
||||
|
||||
# Bar gauge panel
|
||||
# Bar gauge
|
||||
|
||||
The bar gauge simplifies your data by reducing every field to a single value. You choose how Grafana calculates the reduction.
|
||||
|
||||
@@ -14,28 +14,48 @@ This panel can show one or more bar gauges depending on how many series, rows, o
|
||||
|
||||
{{< figure src="/static/img/docs/v66/bar_gauge_cover.png" max-width="1025px" caption="Stat panel" >}}
|
||||
|
||||
## Data and field options
|
||||
## Value options
|
||||
|
||||
Bar gauge visualizations allow you to apply:
|
||||
Use the following options to refine how your visualization displays the value:
|
||||
|
||||
- [Data transformations]({{< relref "../transformations/_index.md" >}})
|
||||
- [Field options and overrides]({{< relref "../field-options/_index.md" >}})
|
||||
- [Thresholds]({{< relref "../thresholds.md" >}})
|
||||
### Show
|
||||
|
||||
## Display options
|
||||
Choose how Grafana displays your data.
|
||||
|
||||
#### Calculate
|
||||
|
||||
Use the following options to refine your visualization:
|
||||
Show a calculated value based on all rows.
|
||||
|
||||
- **Show -** Choose how Grafana displays your data.
|
||||
- **Calculate -** Show a calculated value based on all rows. For a list of available calculations, refer to [List of calculations]({{< relref "../calculations-list.md" >}}).
|
||||
- **All values -** Show a separate stat for every row. If you select this option, then you can also select a **Limit**, or the maximum number of rows to display.
|
||||
- **Value -** Select a reducer function that Grafana will use to reduce many fields to a single value. Click the **Value** list to see functions and brief descriptions.
|
||||
- **Orientation -** Choose a stacking direction.
|
||||
- **Auto -** Grafana selects what it thinks is the best orientation.
|
||||
- **Horizontal -** Bars stretch horizontally, left to right.
|
||||
- **Vertical -** Bars stretch vertically, top to bottom.
|
||||
- **Display mode -** Choose a display mode.
|
||||
- **Gradient -** Threshold levels define a gradient.
|
||||
- **Retro LCD -** The gauge is split into small cells that are lit or unlit.
|
||||
- **Basic -** Single color based on the matching threshold.
|
||||
- **Show unfilled area -** Select this if you want to render the unfilled region of the bars as dark gray. Not applicable to Retro LCD display mode.
|
||||
- **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 "../calculations-list.md" >}}).
|
||||
- **Fields -** Select the fields display in the panel.
|
||||
|
||||
#### All values
|
||||
|
||||
Show a separate stat for every row. If you select this option, then you can also limit the number of rows to display.
|
||||
|
||||
- **Limit -** The maximum number of rows to display. Default is 5,000.
|
||||
- **Fields -** Select the fields display in the panel.
|
||||
|
||||
## Bar gauge options
|
||||
|
||||
Adjust how the bar gauge is displayed.
|
||||
|
||||
### Orientation
|
||||
|
||||
Choose a stacking direction.
|
||||
|
||||
- **Auto -** Grafana selects what it thinks is the best orientation.
|
||||
- **Horizontal -** Bars stretch horizontally, left to right.
|
||||
- **Vertical -** Bars stretch vertically, top to bottom.
|
||||
|
||||
### Display mode
|
||||
|
||||
Choose a display mode.
|
||||
|
||||
- **Gradient -** Threshold levels define a gradient.
|
||||
- **Retro LCD -** The gauge is split into small cells that are lit or unlit.
|
||||
- **Basic -** Single color based on the matching threshold.
|
||||
|
||||
### Show unfilled area
|
||||
|
||||
Select this if you want to render the unfilled region of the bars as dark gray. Not applicable to Retro LCD display mode.
|
||||
|
||||
@@ -1,13 +1,13 @@
|
||||
+++
|
||||
title = "Dashboard list panel"
|
||||
title = "Dashboard list"
|
||||
keywords = ["grafana", "dashboard list", "documentation", "panel", "dashlist"]
|
||||
aliases = ["/docs/grafana/latest/reference/dashlist/", "/docs/grafana/latest/features/panels/dashlist/"]
|
||||
weight = 300
|
||||
+++
|
||||
|
||||
# Dashboard list panel
|
||||
# Dashboard list
|
||||
|
||||
The dashboard list panel allows you to display dynamic links to other dashboards. The list can be configured to use starred dashboards, recently viewed dashboards, a search query, and dashboard tags.
|
||||
The dashboard list visualization allows you to display dynamic links to other dashboards. The list can be configured to use starred dashboards, recently viewed dashboards, a search query, and dashboard tags.
|
||||
|
||||
{{< figure src="/static/img/docs/v45/dashboard-list-panels.png" max-width="850px">}}
|
||||
|
||||
@@ -17,15 +17,13 @@ On each dashboard load, this panel queries the dashboard list, always providing
|
||||
|
||||
Use these options to refine your visualization.
|
||||
|
||||
### Options
|
||||
|
||||
- **Starred -** Display starred dashboards in alphabetical order.
|
||||
- **Recently viewed -** Display recently viewed dashboards in alphabetical order.
|
||||
- **Search -** Display dashboards by search query or tags. You must enter at least one value in **Query** or **Tags**. For the **Query** and **Tags** fields. Variable interpolation is supported, for example,`$my_var` or `${my_var}`.
|
||||
- **Show headings -** The chosen list selection (Starred, Recently viewed, Search) is shown as a heading.
|
||||
- **Max items -** Sets the maximum number of items to list per section. For example, if you left this at the default value of 10 and displayed Starred and Recently viewed dashboards, then the panel would display up to 20 total dashboards, ten in each section.
|
||||
|
||||
### Search
|
||||
## Search
|
||||
|
||||
These options only apply if the **Search** option is selected.
|
||||
|
||||
|
||||
@@ -1,35 +1,49 @@
|
||||
+++
|
||||
title = "Gauge panel"
|
||||
title = "Gauge"
|
||||
description = "Gauge panel docs"
|
||||
keywords = ["grafana", "gauge", "gauge panel"]
|
||||
aliases = ["/docs/grafana/latest/features/panels/gauge/"]
|
||||
weight = 400
|
||||
+++
|
||||
|
||||
# Gauge panel
|
||||
# Gauge
|
||||
|
||||
Gauge is a single value panel that can repeat a gauge for every series, column or row.
|
||||
Gauge is a single-value visualization that can repeat a gauge for every series, column or row.
|
||||
|
||||
{{< figure src="/static/img/docs/v66/gauge_panel_cover.png" max-width="1025px" >}}
|
||||
|
||||
## Data and field options
|
||||
## Value options
|
||||
|
||||
Gauge visualizations allow you to apply:
|
||||
Use the following options to refine how your visualization displays the value:
|
||||
|
||||
- [Data transformations]({{< relref "../transformations/_index.md" >}})
|
||||
- [Field options and overrides]({{< relref "../field-options/_index.md" >}})
|
||||
- [Thresholds]({{< relref "../thresholds.md" >}})
|
||||
### Show
|
||||
|
||||
## Display options
|
||||
Choose how Grafana displays your data.
|
||||
|
||||
#### Calculate
|
||||
|
||||
Use the following options to refine your visualization:
|
||||
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 "../calculations-list.md" >}}).
|
||||
- **Fields -** Select the fields display in the panel.
|
||||
|
||||
#### All values
|
||||
|
||||
Show a separate stat for every row. If you select this option, then you can also limit the number of rows to display.
|
||||
|
||||
- **Limit -** The maximum number of rows to display. Default is 5,000.
|
||||
- **Fields -** Select the fields display in the panel.
|
||||
|
||||
## Gauge
|
||||
|
||||
Adjust how the gauge is displayed.
|
||||
|
||||
- **Show -** Choose how Grafana displays your data.
|
||||
- **Calculate -** Show a calculated **Value** based on all rows. For a list of available calculations, refer to [List of calculations]({{< relref "../calculations-list.md" >}}).
|
||||
- **All values -** Show a separate stat for every row. If you select this option, then you can also select a **Limit**, or the maximum number of rows to display.
|
||||
- **Orientation -** Choose a stacking direction.
|
||||
- **Auto -** Grafana selects what it thinks is the best orientation.
|
||||
- **Horizontal -** Bars stretch horizontally, left to right.
|
||||
- **Vertical -** Bars stretch vertically, top to bottom.
|
||||
- **Show threshold labels -** Controls if threshold values are shown.
|
||||
- **Show threshold markers -** Controls if a threshold band is shown outside the inner gauge value band.
|
||||
|
||||
## Text size
|
||||
|
||||
Adjust the sizes of the gauge text.
|
||||
|
||||
- **Title -** Enter a numeric value for the gauge title size.
|
||||
- **Value -** Enter a numeric value for the gauge value size.
|
||||
@@ -15,7 +15,7 @@ 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 "../transformations/_index.md" >}})
|
||||
- [Field options and overrides]({{< relref "../field-options/_index.md" >}})
|
||||
- [Field overrides]({{< relref "../field-overrides.md" >}})
|
||||
- [Thresholds]({{< relref "../thresholds.md" >}})
|
||||
|
||||
## Display options
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
+++
|
||||
title = "Heatmap panel"
|
||||
title = "Heatmap"
|
||||
description = "Heatmap visualization documentation"
|
||||
keywords = ["grafana", "heatmap", "panel", "documentation"]
|
||||
aliases =["/docs/grafana/latest/features/panels/heatmap/"]
|
||||
weight = 600
|
||||
+++
|
||||
|
||||
# Heatmap panel
|
||||
# Heatmap
|
||||
|
||||
The Heatmap panel visualization allows you to view histograms over time. For more information about histograms, refer to [Introduction to histograms and heatmaps]({{< relref "../../basics/intro-histograms.md" >}}).
|
||||
|
||||
|
||||
@@ -0,0 +1,66 @@
|
||||
+++
|
||||
title = "Histogram"
|
||||
description = "Histogram visualization"
|
||||
keywords = ["grafana", "docs", "bar chart", "panel", "barchart"]
|
||||
weight = 605
|
||||
+++
|
||||
|
||||
# Histogram
|
||||
|
||||
The histogram visualization calculates the distribution of values and presents them as a bar chart. The Y-axis and the height of each bar represent the count of values that fall into each bracket while the X-axis represents the value range.
|
||||
|
||||
{{< figure src="/static/img/docs/histogram-panel/histogram-example-v8-0.png" max-width="625px" caption="Bar chart example" >}}
|
||||
|
||||
## Supported data formats
|
||||
|
||||
Histogram visualization supports time series and any table results with one or more numerical fields.
|
||||
|
||||
## Display options
|
||||
|
||||
Use the following options to refine your visualization.
|
||||
|
||||
### Bucket size
|
||||
|
||||
The size of the buckets. Leave this empty for automatic bucket sizing (~10% of the full range).
|
||||
|
||||
### Bucket offset
|
||||
|
||||
If the first bucket should not start at zero. A non-zero offset has the effect of shifting the aggregation window. For example, 5-sized buckets that are 0-5, 5-10, 10-15 with a default 0 offset would become 2-7, 7-12, 12-17 with an offset of 2; offsets of 0, 5, or 10, in this case, would effectively do nothing. Typically, this option would be used with an explicitly defined bucket size rather than automatic. For this setting to affect, the offset amount should be greater than 0 and less than the bucket size; values outside this range will have the same effect as values within this range.
|
||||
|
||||
### Combine series
|
||||
|
||||
This will merge all series and fields into a combined histogram.
|
||||
|
||||
### Line width
|
||||
|
||||
Controls line width of the bars.
|
||||
|
||||
### Fill opacity
|
||||
|
||||
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 "../standard-options.md#color-scheme" >}}) field option.
|
||||
|
||||
Gradient display is influenced by the **Fill opacity** setting.
|
||||
|
||||
#### None
|
||||
|
||||
No gradient fill. This is the default setting.
|
||||
|
||||
#### Opacity
|
||||
|
||||
Transparency of the gradient is calculated based on the values on the Y-axis. The opacity of the fill is increasing with the values on the Y-axis.
|
||||
|
||||
#### Hue
|
||||
|
||||
Gradient color is generated based on the hue of the line color.
|
||||
|
||||
{{< docs/shared "visualizations/tooltip-mode.md" >}}
|
||||
|
||||
{{< docs/shared "visualizations/legend-mode.md" >}}
|
||||
|
||||
### Legend calculations
|
||||
|
||||
Choose a [standard calculations]({{< relref "../calculations-list.md">}}) to show in the legend. You can select more than one.
|
||||
@@ -9,8 +9,6 @@ weight = 700
|
||||
|
||||
The logs panel visualization shows log lines from data sources that support logs, such as Elastic, Influx, and Loki. Typically you would use this panel next to a graph panel to display the log output of a related process.
|
||||
|
||||
> **Note:** The Logs panel is only available in Grafana v6.4+.
|
||||
|
||||
<img class="screenshot" src="/static/img/docs/v64/logs-panel.png">
|
||||
|
||||
The logs panel shows the result of queries that were entered in the Query tab. The results of multiple queries are merged and sorted by time. You can scroll inside the panel if the data source returns more lines than can be displayed at any one time.
|
||||
|
||||
@@ -1,11 +1,11 @@
|
||||
+++
|
||||
title = "News panel"
|
||||
title = "News"
|
||||
keywords = ["grafana", "news", "documentation", "panels", "news panel"]
|
||||
weight = 800
|
||||
+++
|
||||
|
||||
## News panel
|
||||
## News
|
||||
|
||||
This panel displays an RSS feed. By default, it displays articles from the Grafana Labs blog.
|
||||
This panel visualization displays an RSS feed. By default, it displays articles from the Grafana Labs blog.
|
||||
|
||||
Enter the URL of an RSS in the URL field in the Display section. This panel type does not accept any other queries.
|
||||
|
||||
@@ -8,13 +8,13 @@ weight = 850
|
||||
|
||||
> **Note:** This panel is currently in beta. Expect changes in future releases.
|
||||
|
||||
The _Node graph_ can visualize directed graphs or networks. It uses directed force layout to effectively position the nodes so it can help with displaying complex infrastructure maps, hierarchies or execution diagrams.
|
||||
The _Node graph_ can visualize directed graphs or networks. It uses a directed force layout to effectively position the nodes, so it can display complex infrastructure maps, hierarchies, or execution diagrams.
|
||||
|
||||
|
||||
|
||||
|
||||
## Data requirements
|
||||
|
||||
The Node graph panel requires specific shape of the data to be able to display it's nodes and edges. This means not every data source or query can be visualized in this panel. If you want to use this as a data source developer see the section about data API.
|
||||
The Node graph panel requires specific shape of the data to be able to display its nodes and edges. This means not every data source or query can be visualized in this panel. If you want to use this as a data source developer see the section about data API.
|
||||
|
||||
The Node graph visualization consists of _nodes_ and _edges_.
|
||||
|
||||
@@ -25,11 +25,11 @@ Both nodes and edges can have associated metadata or statistics. The data source
|
||||
|
||||
### Nodes
|
||||
|
||||
> **Note:** At this moment node graph can show only 1,500 nodes. If this limit is crossed a warning will be visible in upper right corner.
|
||||
> **Note:** Node graph can show only 1,500 nodes. If this limit is crossed a warning will be visible in upper right corner, and some nodes will be hidden. You can expand hidden parts of the graph by clicking on the "Hidden nodes" markers in the graph.
|
||||
|
||||
Usually, nodes show two statistical values inside the node and two identifiers just below the node, usually name and type. Nodes can also show another set of values as a color circle around the node, with sections of different color represents different values that should add up to 1.
|
||||
|
||||
For example you can have percentage of errors represented by red portion of the circle. Additional details can be displayed in a context menu when which is displayed when you click on the node. There also can be additional links in the context menu that can target either other parts of Grafana or any external link.
|
||||
For example, you can have the percentage of errors represented by a red portion of the circle. Additional details can be displayed in a context menu which is displayed when you click on the node. There also can be additional links in the context menu that can target either other parts of Grafana or any external link.
|
||||
|
||||
|
||||
|
||||
@@ -45,17 +45,37 @@ You can pan and zoom in or out the node graph.
|
||||
|
||||
### Pan
|
||||
|
||||
You can pan the view by clicking outside of any node or edge and dragging your mouse.
|
||||
You can pan the view by clicking outside any node or edge and dragging your mouse.
|
||||
|
||||
### Zoom in or out
|
||||
|
||||
Use the buttons on the upper left corner or use the mouse wheel, touch pad scroll, together with either Ctrl or Cmd key to zoom in or out.
|
||||
Use the buttons in the upper left corner or use the mouse wheel, touchpad scroll, together with either Ctrl or Cmd key to zoom in or out.
|
||||
|
||||
### Explore hidden nodes
|
||||
|
||||
The number of nodes shown at a given time is limited to maintain a reasonable visualization performance. Nodes that are not currently visible are hidden behind clickable markers that show an approximate number of hidden nodes that are connected by a particular edge. You can click on the marker to expand the graph around that node.
|
||||
|
||||
|
||||
|
||||
### Grid view
|
||||
|
||||
You can switch to the grid view to have a better overview of the most interesting nodes in the graph. Grid view shows nodes in a grid without edges and can be sorted by stats shown inside the node or by stats represented by the a colored border of the nodes.
|
||||
|
||||
|
||||
|
||||
To sort the nodes, click on the stats inside the legend. The marker next to the stat name shows which stat is currently used for sorting and sorting direction.
|
||||
|
||||
|
||||
|
||||
Click on the node and select "Show in Graph layout" option to switch back to graph layout and focus on the selected node, to show it in context of the full graph.
|
||||
|
||||
|
||||
|
||||
## Data API
|
||||
|
||||
This visualization needs a specific shape of the data to be returned from the data source in order to correctly display it.
|
||||
|
||||
Data source needs to return two data frames, one for nodes and one for edges and you also have to set `frame.meta.preferredVisualisationType = 'nodeGraph'` on both data frames.
|
||||
Data source needs to return two data frames, one for nodes and one for edges, and you also have to set `frame.meta.preferredVisualisationType = 'nodeGraph'` on both data frames if you want them to be automatically shown in node graph in Explore.
|
||||
|
||||
### Node parameters
|
||||
|
||||
|
||||
@@ -1,26 +1,18 @@
|
||||
+++
|
||||
title = "Pie chart panel"
|
||||
title = "Pie chart"
|
||||
keywords = ["grafana", "pie chart"]
|
||||
weight = 850
|
||||
+++
|
||||
|
||||
# Pie chart panel
|
||||
# Pie chart
|
||||
|
||||
The pie chart displays reduced series, or values in a series, from one or more queries, as they relate to each other, in the form of slices of a pie. The arc length, area and central angle of a slice are all proportional to the slices value, as it relates to the sum of all values. This type of chart is best used when you want a quick comparison of a small set of values in an aesthetically pleasing form.
|
||||
|
||||
|
||||
|
||||
## Data and field options
|
||||
## Value options
|
||||
|
||||
Pie chart visualizations allow you to apply:
|
||||
|
||||
- [Data transformations]({{< relref "../transformations/_index.md" >}})
|
||||
- [Field options and overrides]({{< relref "../field-options/_index.md" >}})
|
||||
- [Thresholds]({{< relref "../thresholds.md" >}})
|
||||
|
||||
## Display options
|
||||
|
||||
Use the following options to refine your visualization:
|
||||
Use the following options to refine the value in your visualization.
|
||||
|
||||
### Show
|
||||
|
||||
@@ -45,15 +37,19 @@ Select which field or fields to display in the visualization. Each field name is
|
||||
- **All fields -** All fields that are not removed by transformations.
|
||||
- **Time -** All fields with time values.
|
||||
|
||||
## Pie chart options
|
||||
|
||||
Use these options to refine how your visualization looks.
|
||||
|
||||
### Pie chart type
|
||||
|
||||
Select the pie chart display style.
|
||||
|
||||
#### Pie
|
||||
### Pie
|
||||
|
||||
|
||||
|
||||
#### Donut
|
||||
### Donut
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -1,19 +1,18 @@
|
||||
+++
|
||||
title = "Stat panel"
|
||||
title = "Stat"
|
||||
description = "Stat panel documentation"
|
||||
keywords = ["grafana", "docs", "stat panel"]
|
||||
aliases = ["/docs/grafana/latest/features/panels/stat/", "/docs/grafana/latest/features/panels/singlestat/", "/docs/grafana/latest/reference/singlestat/"]
|
||||
weight = 900
|
||||
+++
|
||||
|
||||
# Stat panel
|
||||
# Stat
|
||||
|
||||
The Stat panel shows a one large stat value with an optional graph sparkline. You can control the background or value color using thresholds.
|
||||
The Stat panel visualization shows a one large stat value with an optional graph sparkline. You can control the background or value color using thresholds.
|
||||
|
||||
{{< figure src="/static/img/docs/v66/stat_panel_dark3.png" max-width="1025px" caption="Stat panel" >}}
|
||||
|
||||
> **Note:** This panel replaces the Singlestat panel, which was deprecated in Grafana 7.0.
|
||||
|
||||
> **Note:** This panel replaces the Singlestat panel, which was deprecated in Grafana 7.0 and removed in Grafana 8.0.
|
||||
|
||||
By default, the Stat panel displays one of the following:
|
||||
|
||||
@@ -26,45 +25,78 @@ Example screenshot:
|
||||
|
||||
{{< figure src="/static/img/docs/v71/stat-panel-text-modes.png" max-width="1025px" caption="Stat panel" >}}
|
||||
|
||||
## Data and field options
|
||||
|
||||
Stat visualizations allow you to apply:
|
||||
|
||||
- [Data transformations]({{< relref "../transformations/_index.md" >}})
|
||||
- [Field options and overrides]({{< relref "../field-options/_index.md" >}})
|
||||
- [Thresholds]({{< relref "../thresholds.md" >}})
|
||||
|
||||
## Automatic layout adjustment
|
||||
|
||||
The panel automatically adjusts the layout depending on available width and height in the dashboard. It automatically hides the graph (sparkline) if the panel becomes too small.
|
||||
|
||||
## Display options
|
||||
## Value options
|
||||
|
||||
Use the following options to refine your visualization:
|
||||
Use the following options to refine how your visualization displays the value:
|
||||
|
||||
- **Show -** Choose how Grafana displays your data.
|
||||
- **Calculate -** Show a calculated value based on all rows.
|
||||
- **Calculation -** Select a calculation to apply. For information about available calculations, refer to the [Calculation list]({{< relref "../calculations-list.md" >}}).
|
||||
- **All values -** Show a separate stat for every row.
|
||||
- **Limit -** The maximum number of rows to display.
|
||||
- **Fields -** Select a field name or field type (including **All fields** or **Numeric fields**) to include in this panel.
|
||||
- **Value -** Select a reducer function that Grafana will use to reduce many fields to a single value. Click the **Value** list to see functions and brief descriptions.
|
||||
- **Orientation -** Choose a stacking direction.
|
||||
- **Auto -** Grafana selects what it thinks is the best orientation.
|
||||
- **Horizontal -** Bars stretch horizontally, left to right.
|
||||
- **Vertical -** Bars stretch vertically, top to bottom.
|
||||
- **Text mode -** (Only available in Grafana 7.1+.) You can use the Text mode option to control what text the panel renders. If the value is not important, only the name and color is, then change the **Text mode** to **Name**. The value will still be used to determine color and is displayed in a tooltip.
|
||||
- **Auto -** If the data contains multiple series or fields, show both name and value.
|
||||
- **Value -** Show only value, never name. Name is displayed in the hover tooltip instead.
|
||||
- **Value and name -** Always show value and name.
|
||||
- **Name -** Show name instead of value. Value is displayed in the hover tooltip.
|
||||
- **None -** Show nothing (empty). Name and value are displayed in the hover tooltip.
|
||||
- **Color mode**
|
||||
- **Value -** Colors only the value and graph area.
|
||||
- **Background -** Colors the background as well.
|
||||
- **Graph mode**
|
||||
- **None -** Hides the graph and only shows the value.
|
||||
- **Area -** Shows the area graph below the value. This requires that your query returns a time column.
|
||||
- **Alignment mode -** Choose an alignment mode.
|
||||
- **Auto -** If only a single value is shown (no repeat), then the value is centered. If multiple series or rows are shown, then the value is left-aligned.
|
||||
- **Center -** Stat value is centered.
|
||||
### Show
|
||||
|
||||
Choose how Grafana displays your data.
|
||||
|
||||
#### Calculate
|
||||
|
||||
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 "../calculations-list.md" >}}).
|
||||
- **Fields -** Select the fields display in the panel.
|
||||
|
||||
#### All values
|
||||
|
||||
Show a separate stat for every row. If you select this option, then you can also limit the number of rows to display.
|
||||
|
||||
- **Limit -** The maximum number of rows to display. Default is 5,000.
|
||||
- **Fields -** Select the fields display in the panel.
|
||||
|
||||
## Stat styles
|
||||
|
||||
Style your visualization.
|
||||
|
||||
### Orientation
|
||||
|
||||
Choose a stacking direction.
|
||||
|
||||
- **Auto -** Grafana selects what it thinks is the best orientation.
|
||||
- **Horizontal -** Bars stretch horizontally, left to right.
|
||||
- **Vertical -** Bars stretch vertically, top to bottom.
|
||||
|
||||
### Text mode
|
||||
|
||||
You can use the Text mode option to control what text the panel renders. If the value is not important, only the name and color is, then change the **Text mode** to **Name**. The value will still be used to determine color and is displayed in a tooltip.
|
||||
|
||||
- **Auto -** If the data contains multiple series or fields, show both name and value.
|
||||
- **Value -** Show only value, never name. Name is displayed in the hover tooltip instead.
|
||||
- **Value and name -** Always show value and name.
|
||||
- **Name -** Show name instead of value. Value is displayed in the hover tooltip.
|
||||
- **None -** Show nothing (empty). Name and value are displayed in the hover tooltip.
|
||||
|
||||
### Color mode
|
||||
|
||||
Select a color mode.
|
||||
|
||||
- **Value -** Colors only the value and graph area.
|
||||
- **Background -** Colors the background as well.
|
||||
|
||||
### Graph mode
|
||||
|
||||
Select a graph and splarkline mode.
|
||||
|
||||
- **None -** Hides the graph and only shows the value.
|
||||
- **Area -** Shows the area graph below the value. This requires that your query returns a time column.
|
||||
|
||||
### Text alignment
|
||||
|
||||
Choose an alignment mode.
|
||||
|
||||
- **Auto -** If only a single value is shown (no repeat), then the value is centered. If multiple series or rows are shown, then the value is left-aligned.
|
||||
- **Center -** Stat value is centered.
|
||||
|
||||
## Text size
|
||||
|
||||
Adjust the sizes of the gauge text.
|
||||
|
||||
- **Title -** Enter a numeric value for the gauge title size.
|
||||
- **Value -** Enter a numeric value for the gauge value size.
|
||||
|
||||
@@ -0,0 +1,58 @@
|
||||
+++
|
||||
title = "State timeline"
|
||||
description = "State timeline visualization"
|
||||
keywords = ["grafana", "docs", "state timeline", "panel"]
|
||||
weight = 900
|
||||
+++
|
||||
|
||||
# State timeline
|
||||
|
||||
The state timeline panel visualization shows discrete state changes over time. Each field or series is rendered as its unique horizontal band. State regions can either be rendered with or without values. This panel works well with string or boolean states but can also be used with time series. When used with time series, the thresholds are used to turn the numerical values into discrete state regions.
|
||||
|
||||
{{< figure src="/static/img/docs/v8/state_timeline_strings.png" max-width="1025px" caption="state timeline with string states" >}}
|
||||
|
||||
## State timeline options
|
||||
|
||||
Use these options to refine the visualization.
|
||||
|
||||
### Merge equal consecutive values
|
||||
|
||||
Controls whether Grafana merges identical values if they are next to each other.
|
||||
|
||||
### Show values
|
||||
|
||||
Controls whether values are rendered inside the state regions. Auto will render values if there is sufficient space.
|
||||
|
||||
### Align values
|
||||
|
||||
Controls value alignment inside state regions.
|
||||
|
||||
### Row height
|
||||
|
||||
Controls how much space between rows there are. 1 = no space = 0.5 = 50% space.
|
||||
|
||||
### Line width
|
||||
|
||||
Controls line width of state regions.
|
||||
|
||||
### Fill opacity
|
||||
|
||||
Controls the opacity of state regions.
|
||||
|
||||
## Value mappings
|
||||
|
||||
To assign colors to boolean or string values, use the [Value mappings](< {{ refref "../value-mappings.md"}} >).
|
||||
|
||||
{{< figure src="/static/img/docs/v8/value_mappings_side_editor.png" max-width="300px" caption="Value mappings side editor" >}}
|
||||
|
||||
## Time series data with thresholds
|
||||
|
||||
The panel can be used with time series data as well. In this case, the thresholds are used to turn the time series into discrete colored state regions.
|
||||
|
||||
{{< figure src="/static/img/docs/v8/state_timeline_time_series.png" max-width="1025px" caption="state timeline with time series" >}}
|
||||
|
||||
## Legend options
|
||||
|
||||
When the legend option is enabled it can show either the value mappings or the threshold brackets. To show the value mappings in the legend, it's important that the `Color scheme` option under [Standard options]({{< relref "../standard-options.md" >}}) is set to `Single color` or `Classic palette`. To see the threshold brackets in the legend set the `Color scheme` to `From thresholds`.
|
||||
|
||||
{{< docs/shared "visualizations/legend-mode.md" >}}
|
||||
@@ -0,0 +1,55 @@
|
||||
+++
|
||||
title = "Status history"
|
||||
description = "Status history visualization"
|
||||
keywords = ["grafana", "docs", "status history", "panel"]
|
||||
weight = 900
|
||||
+++
|
||||
|
||||
# Status history
|
||||
|
||||
The Status history visualization shows periodic states over time. Each field or series is rendered as a horizontal row. Boxes are rendered and centered around each value.
|
||||
|
||||
{{< figure src="/static/img/docs/status-history-panel/status-history-example-v8-0.png" max-width="1025px" caption="Status history example" >}}
|
||||
|
||||
## Supported data
|
||||
|
||||
Status history visualization works with string, boolean and numerical fields or time series. A time field is required. You can use value mappings to color strings or assign text values to numerical ranges.
|
||||
|
||||
## Display options
|
||||
|
||||
Use these options to refine the visualization.
|
||||
|
||||
### Show values
|
||||
|
||||
Controls whether values are rendered inside the value boxes. Auto will render values if there is sufficient space.
|
||||
|
||||
### Column width
|
||||
|
||||
Controls the width of boxes. 1 = maximum space and 0 = minimum space.
|
||||
|
||||
### Line width
|
||||
|
||||
Controls line width of state regions.
|
||||
|
||||
### Fill opacity
|
||||
|
||||
Controls the opacity of state regions.
|
||||
|
||||
## Value mappings
|
||||
|
||||
To assign colors to boolean or string values, use the [Value mappings](< {{ refref "../value-mappings.md"}} >).
|
||||
|
||||
{{< figure src="/static/img/docs/v8/value_mappings_side_editor.png" max-width="300px" caption="Value mappings side editor" >}}
|
||||
|
||||
## Time series data with thresholds
|
||||
|
||||
The panel can be used with time series data as well. In this case, the thresholds are used to color the boxes. You can also
|
||||
use gradient color schemes to color values.
|
||||
|
||||
{{< figure src="/static/img/docs/v8/state_timeline_time_series.png" max-width="1025px" caption="state timeline with time series" >}}
|
||||
|
||||
## Legend options
|
||||
|
||||
When the legend option is enabled it can show either the value mappings or the threshold brackets. To show the value mappings in the legend, it's important that the `Color scheme` option under [Standard options]({{< relref "../standard-options.md" >}}) is set to `Single color` or `Classic palette`. To see the threshold brackets in the legend set the `Color scheme` to `From thresholds`.
|
||||
|
||||
{{< docs/shared "visualizations/legend-mode.md" >}}
|
||||
@@ -1,36 +1,93 @@
|
||||
+++
|
||||
title = "Table panel"
|
||||
title = "Table"
|
||||
keywords = ["grafana", "dashboard", "documentation", "panels", "table panel"]
|
||||
aliases = ["/docs/grafana/latest/reference/table/", "/docs/grafana/latest/features/panels/table_panel/"]
|
||||
aliases = ["/docs/grafana/latest/reference/table/", "/docs/grafana/latest/features/panels/table_panel/", "/docs/grafana/next/panels/visualizations/table/table-field-options/"]
|
||||
weight = 1000
|
||||
+++
|
||||
|
||||
# Table panel
|
||||
# Table
|
||||
|
||||
The table panel is very flexible, supporting multiple modes for time series and for tables, annotation, and raw JSON data. This panel also provides date formatting, value formatting, and coloring options.
|
||||
The table panel visualization is very flexible, supporting multiple modes for time series and for tables, annotation, and raw JSON data. This panel also provides date formatting, value formatting, and coloring options.
|
||||
|
||||
{{< figure src="/static/img/docs/tables/table_visualization.png" max-width="1200px" lightbox="true" caption="Table visualization" >}}
|
||||
|
||||
## Data and field options
|
||||
|
||||
Table visualizations allow you to apply:
|
||||
|
||||
- [Data transformations]({{< relref "../../transformations/_index.md" >}})
|
||||
- [Field options and overrides]({{< relref "../../field-options/_index.md" >}})
|
||||
- [Thresholds]({{< relref "../../thresholds.md" >}})
|
||||
|
||||
## Display options
|
||||
|
||||
> **Note:** If you are using a table visualization created before Grafana 7.0, then you need to migrate to the new table version in order to see these options. To migrate, on the Panel tab, click **Table** visualization. Grafana updates the table version and you can then access all table options.
|
||||
|
||||
- **Show header -** Show or hide column names imported from your data source.
|
||||
- **Sort ascending/descending -** Click a column title to change the sort order from default to descending to ascending. Each time you click, the sort order changes to the next option in the cycle. You can only sort by one column at a time.
|
||||
|
||||
|
||||
|
||||
- [Table field options]({{< relref "table-field-options.md" >}}) allow you to change [field options]({{< relref "../../field-options/_index.md" >}}) such as column width, alignment, and cell display mode.
|
||||
- [Filter table columns]({{< relref "filter-table-columns.md" >}}) - You can temporarily change how column data is displayed. For example, you can order values from highest to lowest or hide specific values.
|
||||
|
||||
## Annotation support
|
||||
|
||||
Annotations are not currently supported in the new table panel. This might be added back in a future release.
|
||||
|
||||
## Sort column
|
||||
|
||||
Click a column title to change the sort order from default to descending to ascending. Each time you click, the sort order changes to the next option in the cycle. You can only sort by one column at a time.
|
||||
|
||||
|
||||
|
||||
## Table options
|
||||
|
||||
> **Note:** If you are using a table visualization created before Grafana 7.0, then you need to migrate to the new table version in order to see these options. To migrate, on the Panel tab, click **Table** visualization. Grafana updates the table version and you can then access all table options.
|
||||
|
||||
### Show header
|
||||
|
||||
Show or hide column names imported from your data source.
|
||||
|
||||
## Column width
|
||||
|
||||
By default, Grafana automatically calculates the column width based on the cell contents. In this field option, can override the setting and define the width for all columns in pixels.
|
||||
|
||||
For example, if you enter `100` in the field, then when you click outside the field, all the columns will be set to 100 pixels wide.
|
||||
|
||||
## Column alignment
|
||||
|
||||
Choose how Grafana should align cell contents:
|
||||
|
||||
- Auto (default)
|
||||
- Left
|
||||
- Center
|
||||
- Right
|
||||
|
||||
## Cell display mode
|
||||
|
||||
By default, Grafana automatically chooses display settings. You can override the settings by choosing one of the following options to change all fields.
|
||||
|
||||
> **Note:** If you set these in the Field tab, then the display modes will apply to all fields, including the time field. Many options will work best if you set them in the Override tab.
|
||||
|
||||
### Color text
|
||||
|
||||
If thresholds are set, then the field text is displayed in the appropriate threshold color.
|
||||
|
||||
{{< figure src="/static/img/docs/tables/color-text.png" max-width="500px" caption="Color text" class="docs-image--no-shadow" >}}
|
||||
|
||||
### Color background (gradient or solid)
|
||||
|
||||
If thresholds are set, then the field background is displayed in the appropriate threshold color.
|
||||
|
||||
{{< figure src="/static/img/docs/tables/color-background.png" max-width="500px" caption="Color background" class="docs-image--no-shadow" >}}
|
||||
|
||||
### Gradient gauge
|
||||
|
||||
The threshold levels define a gradient.
|
||||
|
||||
{{< figure src="/static/img/docs/tables/gradient-gauge.png" max-width="500px" caption="Gradient gauge" class="docs-image--no-shadow" >}}
|
||||
|
||||
### LCD gauge
|
||||
|
||||
The gauge is split up in small cells that are lit or unlit.
|
||||
|
||||
{{< figure src="/static/img/docs/tables/lcd-gauge.png" max-width="500px" caption="LCD gauge" class="docs-image--no-shadow" >}}
|
||||
|
||||
### JSON view
|
||||
|
||||
Shows value formatted as code. If a value is an object the JSON view allowing browsing the JSON object will appear on hover.
|
||||
|
||||
{{< figure src="/static/img/docs/tables/json-view.png" max-width="500px" caption="JSON view" class="docs-image--no-shadow" >}}
|
||||
|
||||
### Image
|
||||
|
||||
> Only available in Grafana 7.3+
|
||||
|
||||
If you have a field value that is an image URL or a base64 encoded image you can configure the table to display it as an image.
|
||||
|
||||
{{< figure src="/static/img/docs/v73/table_hover.gif" max-width="900px" caption="Table hover" >}}
|
||||
|
||||
## Column filter
|
||||
|
||||
You can temporarily change how column data is displayed. For example, you can order values from highest to lowest or hide specific values. For more information, refer to [Filter table columns]({{< relref "./filter-table-columns.md" >}}).
|
||||
|
||||
@@ -1,14 +1,13 @@
|
||||
+++
|
||||
title = "Filter table columns"
|
||||
keywords = ["grafana", "table options", "documentation", "format tables", "table filter", "filter columns"]
|
||||
aliases = ["/docs/grafana/latest/reference/table/", "/docs/grafana/latest/features/panels/table_panel/", "/docs/grafana/next/panels/visualizations/table/table-field-options/"]
|
||||
weight = 600
|
||||
+++
|
||||
|
||||
# Filter table columns
|
||||
|
||||
> **Note:** This feature is available in Grafana 7.2+.
|
||||
|
||||
If you turn on the **Column filter** in [Table options]({{< relref "table-field-options.md" >}}), then you can filter table options.
|
||||
If you turn on the **Column filter**, then you can filter table options.
|
||||
|
||||
## Turn on column filtering
|
||||
|
||||
|
||||
@@ -1,12 +1,12 @@
|
||||
+++
|
||||
title = "Text panel"
|
||||
title = "Text"
|
||||
keywords = ["grafana", "text", "documentation", "panel"]
|
||||
aliases = ["/docs/grafana/latest/reference/alertlist/", "/docs/grafana/latest/features/panels/text/"]
|
||||
weight = 1100
|
||||
+++
|
||||
|
||||
# Text panel
|
||||
# Text
|
||||
|
||||
The text panel lets you make information and description panels for your dashboards.
|
||||
The text panel visualization lets you make information and description panels for your dashboards.
|
||||
|
||||
In **Mode**, select whether you want to use markdown or HTML to style your text, then enter content in the box below. Grafana includes a title and paragraph to help you get started, or you can paste content in from another editor.
|
||||
|
||||
@@ -1,36 +1,22 @@
|
||||
+++
|
||||
title = "Time series panel"
|
||||
title = "Time series"
|
||||
keywords = ["grafana", "graph panel", "time series panel", "documentation", "guide", "graph"]
|
||||
weight = 1200
|
||||
+++
|
||||
|
||||
# Time series panel
|
||||
# Time series
|
||||
|
||||
> **Note:** Time series panel is going to replace the Graph panel in a future release.
|
||||
> **Note:** Time series panel visualization is going to replace the Graph panel visualization in a future release.
|
||||
|
||||
Time series panel is a robust visualization to plot time series data. It can render as a line, a path of dots, or a series of bars. This type of graph is versatile enough to display almost any time-series data.
|
||||
|
||||
For Time series panel examples, refer to the Grafana Play dashboard [New Features in v7.4](https://play.grafana.org/d/nP8rcffGk/new-features-in-v7-4?orgId=1).
|
||||
|
||||
## Data and field options
|
||||
> **Note:** You can migrate Graph panel visualizations to Time series visualizations. To migrate, open the panel and then select the **Time series** visualization. Grafana transfers all applicable settings.
|
||||
|
||||
Time series visualizations allow you to apply:
|
||||
## Common time series options
|
||||
|
||||
- [Data transformations]({{< relref "../../transformations/_index.md" >}})
|
||||
- [Field options and overrides]({{< relref "../../field-options/_index.md" >}})
|
||||
- [Thresholds]({{< relref "../../thresholds.md" >}})
|
||||
|
||||
You can also use field options to create different types of graphs or adjust your axes:
|
||||
|
||||
- [Graph time series as lines]({{< relref "graph-time-series-as-lines.md" >}})
|
||||
- [Graph time series as bars]({{< relref "graph-time-series-as-bars.md" >}})
|
||||
- [Graph time series as points]({{< relref "graph-time-series-as-points.md" >}})
|
||||
- [Change axis display]({{< relref "change-axis-display.md" >}})
|
||||
- [Graph stacked time series]({{< relref "graph-time-series-stacking.md" >}})
|
||||
|
||||
## Display options
|
||||
|
||||
> **Note:** You can migrate Graph panel visualizations to Time series visualizations. To migrate, on the Panel tab, click **Time series** visualization. Grafana transfers all applicable settings. (While in beta, migration is still being refined. It will get better as time goes on!)
|
||||
These options are available whether you are graphing your time series as lines, bars, or points.
|
||||
|
||||
{{< docs/shared "visualizations/tooltip-mode.md" >}}
|
||||
|
||||
@@ -39,3 +25,16 @@ You can also use field options to create different types of graphs or adjust you
|
||||
### Legend calculations
|
||||
|
||||
Choose which of the [standard calculations]({{< relref "../../calculations-list.md">}}) to show in the legend. You can have more than one.
|
||||
|
||||
## Graph styles
|
||||
|
||||
Use these options to choose how to display your time series data.
|
||||
|
||||
- [Graph time series as lines]({{< relref "./graph-time-series-as-lines.md" >}})
|
||||
- [Graph time series as bars]({{< relref "./graph-time-series-as-bars.md" >}})
|
||||
- [Graph time series as points]({{< relref "./graph-time-series-as-points.md" >}})
|
||||
- [Graph stacked time series]({{< relref "./graph-time-series-stacking.md" >}})
|
||||
|
||||
## Axis
|
||||
|
||||
For more information about adjusting your time series axes, refer to [Change axis display]({{< relref "change-axis-display.md" >}}).
|
||||
|
||||
@@ -12,11 +12,6 @@ This section explains how to use Time series field options to control the displa
|
||||
|
||||
Use the following field settings to refine how your axes display.
|
||||
|
||||
For more information about applying these options, refer to:
|
||||
|
||||
- [Configure all fields]({{< relref "../../field-options/configure-all-fields.md" >}})
|
||||
- [Configure specific fields]({{< relref "../../field-options/configure-specific-fields.md" >}})
|
||||
|
||||
Some field options will not affect the visualization until you click outside of the field option box you are editing or press Enter.
|
||||
|
||||
## Placement
|
||||
|
||||
@@ -13,18 +13,13 @@ This section explains how to use Time series field options to visualize time ser
|
||||
## Create the panel
|
||||
|
||||
1. [Add a panel]({{< relref "../../add-a-panel.md" >}}). Select the [Time series]({{< relref "_index.md" >}}) visualization.
|
||||
1. In the [Panel editor]({{< relref "../../panel-editor.md" >}}), click the **Field** tab.
|
||||
1. In Style, click **Bars**.
|
||||
2. In the [Panel editor]({{< relref "../../panel-editor.md" >}}) side pane, click **Graph styles** to expand it.
|
||||
3. In Style, click **Bars**.
|
||||
|
||||
## Style the bars
|
||||
|
||||
Use the following field settings to refine your visualization.
|
||||
|
||||
For more information about applying these options, refer to:
|
||||
|
||||
- [Configure all fields]({{< relref "../../field-options/configure-all-fields.md" >}})
|
||||
- [Configure specific fields]({{< relref "../../field-options/configure-specific-fields.md" >}})
|
||||
|
||||
Some field options will not affect the visualization until you click outside of the field option box you are editing or press Enter.
|
||||
|
||||
### Bar alignment
|
||||
|
||||
@@ -13,18 +13,13 @@ This section explains how to use Time series field options to visualize time ser
|
||||
## Create the panel
|
||||
|
||||
1. [Add a panel]({{< relref "../../add-a-panel.md" >}}). Select the [Time series]({{< relref "_index.md" >}}) visualization.
|
||||
1. In the [Panel editor]({{< relref "../../panel-editor.md" >}}), click the **Field** tab.
|
||||
1. In the [Panel editor]({{< relref "../../panel-editor.md" >}}) side pane, click **Graph styles** to expand it.
|
||||
1. In Style, click **Lines**.
|
||||
|
||||
## Style the lines
|
||||
|
||||
Use the following field settings to refine your visualization.
|
||||
|
||||
For more information about applying these options, refer to:
|
||||
|
||||
- [Configure all fields]({{< relref "../../field-options/configure-all-fields.md" >}})
|
||||
- [Configure specific fields]({{< relref "../../field-options/configure-specific-fields.md" >}})
|
||||
|
||||
Some field options will not affect the visualization until you click outside of the field option box you are editing or press Enter.
|
||||
|
||||
### Line interpolation
|
||||
@@ -151,21 +146,25 @@ Dot spacing set to 0, 30:
|
||||
|
||||
|
||||
|
||||
### Null values
|
||||
### Connect null values
|
||||
|
||||
Choose how null values (gaps in the data) are displayed on the graph.
|
||||
Choose how null values (gaps in the data) are displayed on the graph. Null values can be connected to form a continuous line or, optionally, set a threshold above which gaps in the data should no longer be connected.
|
||||
|
||||
#### Gaps
|
||||
|
||||
|
||||
If there is a gap in the series, the line in the graph will be broken and show the gap.
|
||||
#### Never
|
||||
|
||||
|
||||
Time series data points with gaps in the the data are never connected.
|
||||
|
||||
#### Connected
|
||||
#### Always
|
||||
|
||||
If there is a gap in the series, the line will skip the gap and connect to the next non-null value.
|
||||
Time series data points with gaps in the the data are always connected.
|
||||
|
||||
|
||||
#### Threshold
|
||||
|
||||
A threshold can be set above which gaps in the data should no longer be connected. This can be useful when the connected gaps in the data are of a known size and/or within a known range and gaps outside this range should no longer be connected.
|
||||
|
||||
|
||||
|
||||
### Show points
|
||||
|
||||
|
||||
@@ -13,18 +13,13 @@ This section explains how to use Time series field options to visualize time ser
|
||||
## Create the panel
|
||||
|
||||
1. [Add a panel]({{< relref "../../add-a-panel.md" >}}). Select the [Time series]({{< relref "_index.md" >}}) visualization.
|
||||
1. In the [Panel editor]({{< relref "../../panel-editor.md" >}}), click the **Field** tab..
|
||||
1. In the [Panel editor]({{< relref "../../panel-editor.md" >}}) side pane, click **Graph styles** to expand it.
|
||||
1. In Style, click **Points**.
|
||||
|
||||
## Style the points
|
||||
|
||||
Use the following field settings to refine your visualization.
|
||||
|
||||
For more information about applying these options, refer to:
|
||||
|
||||
- [Configure all fields]({{< relref "../../field-options/configure-all-fields.md" >}})
|
||||
- [Configure specific fields]({{< relref "../../field-options/configure-specific-fields.md" >}})
|
||||
|
||||
Some field options will not affect the visualization until you click outside of the field option box you are editing or press Enter.
|
||||
|
||||
### Point size
|
||||
|
||||
@@ -14,11 +14,6 @@ _Stacking_ allows Grafana to display series on top of each other. Be cautious wh
|
||||
|
||||
Use the following field settings to configure your series stacking.
|
||||
|
||||
For more information about applying these options, refer to:
|
||||
|
||||
- [Configure all fields]({{< relref "../../field-options/configure-all-fields.md" >}})
|
||||
- [Configure specific fields]({{< relref "../../field-options/configure-specific-fields.md" >}})
|
||||
|
||||
Some field options will not affect the visualization until you click outside of the field option box you are editing or press Enter.
|
||||
|
||||
## Stack series
|
||||
@@ -43,7 +38,7 @@ Enable stacking series on top of each other.
|
||||
|
||||
The stacking group option is only available as an override.
|
||||
|
||||
For more information about creating field overrides, refer to [Add a field override]({{< relref "../../field-options/configure-specific-fields.md#add-a-field-override" >}})
|
||||
For more information about creating field overrides, refer to [Field overrides]({{< relref "../../field-overrides.md" >}}).
|
||||
|
||||
Stack series in the same group. In the Overrides section:
|
||||
|
||||
@@ -54,7 +49,7 @@ Stack series in the same group. In the Overrides section:
|
||||
1. Click on **Normal** stacking mode.
|
||||
1. Name the stacking group you want the series to appear in. The stacking group name option is only available when creating an override.
|
||||
|
||||
|
||||
|
||||
|
||||
A-series and B-series stacked in group A, C-series, and D-series stacked in group B:
|
||||
|
||||
|
||||
Reference in New Issue
Block a user