mirror of
https://github.com/grafana/grafana.git
synced 2025-02-16 10:24:54 -06:00
Docs: Restructure configure thresholds docs (#81519)
* Removed intro text and About thresholds heading * Added Threshold options H2 with sub-headings and moved Default thresholds to H2 * Rearranged sections and added lorem ipsum placeholder text * Updated heading to Add a threshold, moved delete content to after task, and reformatted task * Replaced lorem ipsum text with TBA * Fixing UI option names * Docs: Edit configure thresholds page (#81520) * Added contractions * Added Threshold value heading and updated options information * Rewrote task * Added Supported visualizations section, updated links, and made general copy edits * Copy edits * Added screenshots for some examples * Edited intro section * Added table, removed note, and added note about options * Updated table and removed bullet list * Added table of threshold examples, other copy edits * Applied suggestions from review * Fixed deprecation note * Updated deprecation note * Replaced local images with uploaded images * Fixed deprecation note
This commit is contained in:
Isabel
GitHub
parent
de4171862c
commit
5d7ed2319f
@ -20,60 +20,101 @@ weight: 100
|
||||
|
||||
# Configure thresholds
|
||||
|
||||
This section includes information about using thresholds in your visualizations. You'll learn about thresholds, their defaults, how to add or delete a threshold, and adding a threshold to a legacy panel.
|
||||
In dashboards, a threshold is a value or limit you set for a metric that's reflected visually when it's met or exceeded. Thresholds are one way you can conditionally style and color your visualizations based on query results.
|
||||
|
||||
## About thresholds
|
||||
Using thresholds, you can color grid lines and regions in a time series visualization:
|
||||
|
||||
|
||||
A threshold is a value that you specify for a metric that is visually reflected in a dashboard when the threshold value is met or exceeded.
|
||||
You can color the background or value text in a stat visualization:
|
||||
|
||||
|
||||
Thresholds provide one method for you to conditionally style and color your visualizations based on query results. You can apply thresholds to most, but not all, visualizations. For more information about visualizations, refer to [Visualization panels][].
|
||||
You can define regions and region colors in a state timeline:
|
||||
|
||||
|
||||
You can use thresholds to:
|
||||
You can also use thresholds to:
|
||||
|
||||
- Color grid lines or grid areas in the [Time-series visualization][]
|
||||
- Color lines in the [Time-series visualization][]
|
||||
- Color the background or value text in the [Stat visualization][]
|
||||
- Color the gauge and threshold markers in the [Gauge visualization][]
|
||||
- Color markers in the [Geomap visualization][]
|
||||
- Color cell text or background in the [Table visualization][]
|
||||
- Define regions and region colors in the [State timeline visualization][]
|
||||
- Color lines in a time series visualization
|
||||
- Color the gauge and threshold markers in a gauge
|
||||
- Color markers in a geomap
|
||||
- Color cell text or background in a table
|
||||
|
||||
There are two types of thresholds:
|
||||
## Supported visualizations
|
||||
|
||||
- **Absolute** thresholds are defined by a number. For example, 80 on a scale of 1 to 150.
|
||||
- **Percentage** thresholds are defined relative to minimum or maximum. For example, 80 percent.
|
||||
You can set thresholds in the following visualizations:
|
||||
|
||||
### Default thresholds
|
||||
| | | |
|
||||
| -------------------------- | -------------------------------- | -------------------------------- |
|
||||
| [Bar chart][bar chart] | [Geomap][geomap] | [Status history][status history] |
|
||||
| [Bar gauge][bar gauge] | [Histogram][histogram] | [Table][table] |
|
||||
| [Candlestick][candlestick] | [Stat][stat] | [Time series][time series] |
|
||||
| [Canvas][canvas] | [State timeline][state timeline] | [Trend][trend] |
|
||||
| [Gauge][gauge] |
|
||||
|
||||
On visualizations that support it, Grafana sets default threshold values of:
|
||||
## Default thresholds
|
||||
|
||||
On visualizations that support thresholds, Grafana has the following default threshold settings:
|
||||
|
||||
- 80 = red
|
||||
- Base = green
|
||||
- Mode = Absolute
|
||||
- Show thresholds = Off (for some visualizations); for more information, see the [Show thresholds](#show-threshold) option.
|
||||
|
||||
The **Base** value represents minus infinity. It is generally the “good” color.
|
||||
## Thresholds options
|
||||
|
||||
## Add or delete a threshold
|
||||
You can set the following options to further define how thresholds look.
|
||||
|
||||
You can add as many thresholds to a panel as you want. Grafana automatically sorts thresholds values from highest to lowest.
|
||||
### Threshold value
|
||||
|
||||
Delete a threshold when it is no longer needed. When you delete a threshold, the system removes the threshold from all visualizations that include the threshold.
|
||||
This number is the value that triggers the threshold. You can also set the color associated with the threshold in this field.
|
||||
|
||||
1. To add a threshold:
|
||||
The **Base** value represents minus infinity. By default, it's set to the color green, which is generally the “good” color.
|
||||
|
||||
a. Edit the panel to which you want to add a threshold.
|
||||
### Thresholds mode
|
||||
|
||||
b. In the options side pane, locate the **Thresholds** section and click **+ Add threshold**.
|
||||
There are two threshold modes:
|
||||
|
||||
c. Select a threshold color, number, and mode.
|
||||
Threshold mode applies to all thresholds on this panel.
|
||||
- **Absolute** thresholds are defined by a number. For example, 80 on a scale of 1 to 150.
|
||||
- **Percentage** thresholds are defined relative to minimum or maximum. For example, 80 percent.
|
||||
|
||||
d. For a time-series panel, select a **Show thresholds** option.
|
||||
### Show thresholds
|
||||
|
||||
1. To delete a threshold, navigate to the panel that contains the threshold and click the trash icon next to the threshold you want to remove.
|
||||
{{< admonition type="note" >}}
|
||||
This option is supported for the bar chart, candlestick, time series, and trend visualizations.
|
||||
{{< /admonition>}}
|
||||
|
||||
Set if and how thresholds are shown with the following options.
|
||||
|
||||
| Option | Example |
|
||||
| ------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
||||
| Off | |
|
||||
| As lines | {{< figure max-width="500px" src="/media/docs/grafana/panels-visualizations/screenshot-thresholds-lines-v10.4.png" alt="Visualization with threshold as a line" >}} |
|
||||
| As lines (dashed) | {{< figure max-width="500px" src="/media/docs/grafana/panels-visualizations/screenshot-thresholds-dashed-lines-v10.4.png" alt="Visualization with threshold as a dashed line" >}} |
|
||||
| As filled regions | {{< figure max-width="500px" src="/media/docs/grafana/panels-visualizations/screenshot-thresholds-regions-v10.4.png" alt="Visualization with threshold as a region" >}} |
|
||||
| As filled regions and lines | {{< figure max-width="500px" src="/media/docs/grafana/panels-visualizations/screenshot-thresholds-lines-regions-v10.4.png" alt="Visualization with threshold as a region and line" >}} |
|
||||
| As filled regions and lines (dashed) | {{< figure max-width="500px" src="/media/docs/grafana/panels-visualizations/screenshot-thresholds-dashed-lines-regions-v10.4.png" alt="Visualization with threshold as a region and dashed line" >}} |
|
||||
|
||||
## Add a threshold
|
||||
|
||||
You can add as many thresholds to a visualization as you want. Grafana automatically sorts thresholds values from highest to lowest.
|
||||
|
||||
1. Navigate to the panel you want to update.
|
||||
1. Hover over any part of the panel you want to work on to display the menu on the top right corner.
|
||||
1. Click the menu and select **Edit**.
|
||||
1. Scroll to the **Thresholds** section or enter `thresholds` in the search bar at the top of the panel edit pane.
|
||||
1. Click **+ Add threshold**.
|
||||
1. Enter a new threshold value or use the up and down arrows at the right side of the field to increase or decrease the value incrementally.
|
||||
1. Click the colored circle to the left of the threshold value to open the color picker, where you can update the threshold color.
|
||||
1. Under **Thresholds mode**, select either **Absolute** or **Percentage**.
|
||||
1. Under **Show thresholds**, set how the threshold is displayed or turn it off.
|
||||
|
||||
To delete a threshold, navigate to the panel that contains the threshold and click the trash icon next to the threshold you want to remove.
|
||||
|
||||
## Add a threshold to a legacy graph panel
|
||||
|
||||
{{< admonition type="caution" >}}
|
||||
Starting with Grafana v11, the legacy graph panel will be deprecated along with all other Angular panel plugins. For more information, refer to [Angular support deprecation](https://grafana.com/docs/grafana/<GRAFANA_VERSION>/developers/angular_deprecation/).
|
||||
{{< /admonition >}}
|
||||
|
||||
In the Graph panel visualization, thresholds enable you to add lines or sections to a graph to make it easier to recognize when the graph crosses a threshold.
|
||||
|
||||
1. Navigate to the graph panel to which you want to add a threshold.
|
||||
@ -94,24 +135,42 @@ In the Graph panel visualization, thresholds enable you to add lines or sections
|
||||
1. Click **Save** to save the changes in the dashboard.
|
||||
|
||||
{{% docs/reference %}}
|
||||
[Table visualization]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/table"
|
||||
[Table visualization]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/table"
|
||||
[bar chart]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/bar-chart"
|
||||
[bar chart]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/bar-chart"
|
||||
|
||||
[Stat visualization]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/stat"
|
||||
[Stat visualization]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/stat"
|
||||
[bar gauge]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/bar-gauge"
|
||||
[bar gauge]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/bar-gauge"
|
||||
|
||||
[Time-series visualization]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/time-series#from-thresholds"
|
||||
[Time-series visualization]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/time-series#from-thresholds"
|
||||
[candlestick]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/candlestick"
|
||||
[candlestick]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/candlestick"
|
||||
|
||||
[State timeline visualization]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/state-timeline"
|
||||
[State timeline visualization]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/state-timeline"
|
||||
[canvas]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/canvas"
|
||||
[canvas]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/canvas"
|
||||
|
||||
[Gauge visualization]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/gauge"
|
||||
[Gauge visualization]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/gauge"
|
||||
[gauge]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/gauge"
|
||||
[gauge]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/gauge"
|
||||
|
||||
[Visualization panels]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations"
|
||||
[Visualization panels]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations"
|
||||
[geomap]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/geomap"
|
||||
[geomap]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/geomap"
|
||||
|
||||
[Geomap visualization]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/geomap"
|
||||
[Geomap visualization]: "/docs/grafana-cloud/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/geomap"
|
||||
[histogram]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/histogram"
|
||||
[histogram]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/histogram"
|
||||
|
||||
[stat]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/stat"
|
||||
[stat]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/stat"
|
||||
|
||||
[state timeline]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/state-timeline"
|
||||
[state timeline]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/state-timeline"
|
||||
|
||||
[status history]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/status-history"
|
||||
[status history]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/status-history"
|
||||
|
||||
[table]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/table"
|
||||
[table]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/table"
|
||||
|
||||
[time series]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/time-series"
|
||||
[time series]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/time-series"
|
||||
|
||||
[trend]: "/docs/grafana/ -> /docs/grafana/<GRAFANA VERSION>/panels-visualizations/visualizations/trend"
|
||||
[trend]: "/docs/grafana-cloud/ -> /docs/grafana-cloud/visualizations/panels-visualizations/visualizations/trend"
|
||||
{{% /docs/reference %}}
|
||||
|
||||
Loading…
Reference in New Issue
Block a user