Docs: refactors configure standard options (#52278)

* refactors configure standard options

* makes prettier
pull/52363/head
Christopher Moyer 3 years ago committed by GitHub
parent 1834973cc6
commit 433bb735de
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 8
      docs/sources/dashboards/add-organize-panels.md
  2. 4
      docs/sources/datasources/mssql.md
  3. 4
      docs/sources/datasources/mysql.md
  4. 4
      docs/sources/datasources/postgres.md
  5. 127
      docs/sources/panels/configure-standard-options/index.md
  6. 34
      docs/sources/panels/working-with-panels/apply-color-to-series.md
  7. 27
      docs/sources/panels/working-with-panels/format-standard-fields.md
  8. 2
      docs/sources/setup-grafana/upgrade-grafana.md
  9. 2
      docs/sources/visualizations/bar-chart.md
  10. 2
      docs/sources/visualizations/histogram.md
  11. 2
      docs/sources/visualizations/state-timeline.md
  12. 2
      docs/sources/visualizations/status-history.md
  13. 2
      docs/sources/visualizations/time-series/change-axis-display.md
  14. 2
      docs/sources/visualizations/time-series/graph-color-scheme.md
  15. 4
      docs/sources/visualizations/time-series/graph-time-series-as-bars.md
  16. 6
      docs/sources/visualizations/time-series/graph-time-series-as-lines.md

@ -35,11 +35,7 @@ This section describes the areas of the Grafana panel editor.
- **Transform tab -** Apply data transformations. For more information, refer to [Transform data]({{< relref "../panels/transform-data/" >}}).
- **Alert tab -** Write alert rules. For more information, refer to [Overview of Grafana 8 alerting]({{< relref "../alerting/" >}}).
1. Panel display options: The display options section contains tabs where you configure almost every aspect of your data visualization, including:
- [Apply color to series and fields]({{< relref "../panels/working-with-panels/apply-color-to-series/" >}})
- [Format a standard field]({{< relref "../panels/working-with-panels/format-standard-fields/" >}})
- [Add a title and description to a panel]({{< relref "../panels/working-with-panels/add-title-and-description/" >}})
1. Panel display options: The display options section contains tabs where you configure almost every aspect of your data visualization.
> Not all options are available for each visualization.
@ -101,7 +97,7 @@ Dashboards and panels allow you to show your data in visual form. Each panel nee
- [Visualization-specific options]({{< relref "../visualizations/" >}})
- [Override field values]({{< relref "../panels/override-field-values/about-field-overrides/" >}})
- [Configure thresholds]({{< relref "../panels/configure-thresholds/" >}})
- [Apply color to series and fields]({{< relref "../panels/working-with-panels/apply-color-to-series/" >}})
- [Configure standard options]({{< relref "../panels/configure-standard-options/" >}})
1. Add a note to describe the visualization (or describe your changes) and then click **Save** in the upper-right corner of the page.

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

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

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

@ -1,15 +1,39 @@
---
aliases:
- /docs/grafana/latest/panels/working-with-panels/format-standard-fields/
- /docs/grafana/latest/panels/reference-standard-field-definitions/
- /docs/grafana/latest/panels/standard-field-definitions/
- /docs/sources/panels/reference-standard-field-definitions/
title: Standard field definitions
weight: 1200
title: Configure standard options
menuTitle: Configure standard options
weight: 40
keywords:
- xxx
- xxx
---
# Reference: Standard field definitions
# Configure standard options
This section explains all available standard options. They are listed in alphabetical order.
The data model used in Grafana, namely the [data frame]({{< relref "../../developers/plugins/data-frames/" >}}), is a columnar-oriented table structure that unifies both time series and table query results. Each column within this structure is called a _field_. A field can represent a single time series or table column.
Field options allow you to change how the data is displayed in your visualizations. Options and overrides that you apply do not change the data, they change how Grafana displays the data. When you change an option, it is applied to all fields, meaning all series or columns. For example, if you change the unit to percentage, then all fields with numeric values are displayed in percentages.
For a complete list of field formatting options, refer to [Standard options definitions]({{< relref "#standard-options-definitions" >}}).
> You can apply standard options to most built-in Grafana panels. Some older panels and community panels that have not updated to the new panel and data model will be missing either all or some of these field options.
1. Open a dashboard, click the panel title, and click **Edit**.
1. In the panel display options pane, locate the **Standard options** section.
1. Select the standard options you want to apply.
For more information about standard options, refer to [Standard options definitions]({{< relref "#standard-options-definitions" >}}).
1. To preview your change, click outside of the field option box you are editing or press **Enter**.
## Standard options definitions
This section explains all available standard options.
You can apply standard options to most built-in Grafana panels. Some older panels and community panels that have not updated to the new panel and data model will be missing either all or some of these field options.
@ -17,21 +41,49 @@ Most field options will not affect the visualization until you click outside of
> **Note:** We are constantly working to add and expand options for all visualization, so all options might not be available for all visualizations.
## Decimals
### Unit
Number of decimals to render value with. Leave empty for Grafana to use the number of decimals provided by the data source.
Lets you choose what unit a field should use. Click in the **Unit** field, then drill down until you find the unit you want. The unit you select is applied to all fields except time.
To change this setting, type a number in the field and then click outside the field or press Enter.
#### Custom units
You can use the unit dropdown to also specify custom units, custom prefix or suffix and date time formats.
To select a custom unit enter the unit and select the last `Custom: xxx` option in the dropdown.
- `suffix:<suffix>` for custom unit that should go after value.
- `time:<format>` For custom date time formats type for example `time:YYYY-MM-DD`. See [formats](https://momentjs.com/docs/#/displaying/) for the format syntax and options.
- `si:<base scale><unit characters>` for custom SI units. For example: `si: mF`. This one is a bit more advanced as you can specify both a unit and the
source data scale. So if your source data is represented as milli (thousands of) something prefix the unit with that
SI scale character.
- `count:<unit>` for a custom count unit.
- `currency:<unit>` for custom a currency unit.
You can also paste a native emoji in the unit picker and pick it as a custom unit:
{{< figure src="/static/img/docs/v66/custom_unit_burger2.png" max-width="600px" caption="Custom unit emoji" >}}
#### String units
## Data links
Grafana can sometime be too aggressive in parsing strings and displaying them as numbers. To make Grafana show the original string create a field override and add a unit property with the `string` unit.
### Min
Lets you set the minimum value used in percentage threshold calculations. Leave blank for auto calculation based on all series and fields.
### Max
Lets you control the URL to which a value or visualization link.
Lets you set the maximum value used in percentage threshold calculations. Leave blank for auto calculation based on all series and fields.
For more information and instructions, refer to [Data links]({{< relref "./configure-data-links/#data-links" >}}).
### Decimals
Number of decimals to render value with. Leave empty for Grafana to use the number of decimals provided by the data source.
To change this setting, type a number in the field and then click outside the field or press Enter.
## Display name
### Display name
Lets you set the display title of all fields. You can use [variables]({{< relref "../variables/" >}}) in the field title.
Lets you set the display title of all fields. You can use [variables]({{< relref "../../variables/" >}}) in the field title.
When multiple stats, fields, or series are shown, this field controls the title in each stat. You can use expressions like `${__field.name}` to use only the series name or the field name in title.
@ -47,40 +99,31 @@ Given a field with a name of Temp, and labels of {"Loc"="PBI", "Sensor"="3"}
If the value is an empty string after rendering the expression for a particular field, then the default display method is used.
## Max
Lets you set the maximum value used in percentage threshold calculations. Leave blank for auto calculation based on all series and fields
## Min
Lets you set the minimum value used in percentage threshold calculations. Leave blank for auto calculation based on all series and fields
## No value
Enter what Grafana should display if the field value is empty or null. The default value is a hyphen (-).
## Unit
### Color scheme
Lets you choose what unit a field should use. Click in the **Unit** field, then drill down until you find the unit you want. The unit you select is applied to all fields except time.
The color options and their effect on the visualization depends on the visualization you are working with. Some visualizations have different color options.
### Custom units
You can specify a single color, or select a continuous (gradient) color schemes, based on a value.
Continuous color interpolates a color using the percentage of a value relative to min and max.
You can use the unit dropdown to also specify custom units, custom prefix or suffix and date time formats.
Select one of the following palettes:
To select a custom unit enter the unit and select the last `Custom: xxx` option in the dropdown.
<div class="clearfix"></div>
- `suffix:<suffix>` for custom unit that should go after value.
- `time:<format>` For custom date time formats type for example `time:YYYY-MM-DD`. See [formats](https://momentjs.com/docs/#/displaying/) for the format syntax and options.
- `si:<base scale><unit characters>` for custom SI units. For example: `si: mF`. This one is a bit more advanced as you can specify both a unit and the
source data scale. So if your source data is represented as milli (thousands of) something prefix the unit with that
SI scale character.
- `count:<unit>` for a custom count unit.
- `currency:<unit>` for custom a currency unit.
| Color mode | Description |
| ------------------------------- | -------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Single color** | Specify a single color, useful in an override rule |
| **From thresholds** | Informs Grafana to take the color from the matching threshold |
| **Classic palette** | Grafana will assign color by looking up a color in a palette by series index. Useful for Graphs and pie charts and other categorical data visualizations |
| **Green-Yellow-Red (by value)** | Continuous color scheme |
| **Blue-Yellow-Red (by value)** | Continuous color scheme |
| **Blues (by value)** | Continuous color scheme (panel background to blue) |
| **Reds (by value)** | Continuous color scheme (panel background color to blue) |
| **Greens (by value)** | Continuous color scheme (panel background color to blue) |
| **Purple (by value)** | Continuous color scheme (panel background color to blue) |
You can also paste a native emoji in the unit picker and pick it as a custom unit:
{{< figure src="/static/img/docs/v73/color_scheme_dropdown.png" max-width="350px" caption="Color scheme" >}}
{{< figure src="/static/img/docs/v66/custom_unit_burger2.png" max-width="600px" caption="Custom unit emoji" >}}
### No value
### String units
Grafana can sometime be too aggressive in parsing strings and displaying them as numbers. To make Grafana show the original string create a field override and add a unit property with the `string` unit.
Enter what Grafana should display if the field value is empty or null. The default value is a hyphen (-).

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

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

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

@ -157,4 +157,4 @@ Set a **Soft min** or **soft max** option for better control of Y-axis limits. B
**Soft min** and **soft max** settings can prevent blips from turning into mountains when the data is mostly flat, and hard min or max derived from standard min and max field options can prevent intermittent spikes from flattening useful detail by clipping the spikes past a defined point.
You can set standard min/max options to define hard limits of the Y-axis. For more information, refer to [Standard field definitions]({{< relref "../panels/standard-field-definitions/#max" >}}).
You can set standard min/max options to define hard limits of the Y-axis. For more information, refer to [Standard options definitions]({{< relref "../panels/configure-standard-options/#max" >}}).

@ -50,7 +50,7 @@ Controls the fill opacity bars.
### Gradient mode
Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard [color scheme]({{< relref "../panels/working-with-panels/apply-color-to-series/" >}}) field option.
Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard [color scheme]({{< relref "../panels/configure-standard-options/#color-scheme" >}}) field option.
Gradient display is influenced by the **Fill opacity** setting.

@ -60,6 +60,6 @@ The panel can be used with time series data as well. In this case, the threshold
## 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` as referenced in [Apply color to a series and fields]({{< relref "../panels/working-with-panels/apply-color-to-series/" >}}) is set to `Single color` or `Classic palette`. To see the threshold brackets in the legend set the `Color scheme` to `From thresholds`.
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` as referenced in [Color scheme]({{< relref "../panels/configure-standard-options/#color-scheme" >}}) 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" >}}

@ -57,6 +57,6 @@ use gradient color schemes to color values.
## 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` as referenced in [Apply color to a series and fields]({{< relref "../panels/working-with-panels/apply-color-to-series/" >}}) is set to `Single color` or `Classic palette`. To see the threshold brackets in the legend set the `Color scheme` to `From thresholds`.
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` as referenced in [Color scheme]({{< relref "../panels/configure-standard-options/#color-scheme" >}}) 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" >}}

@ -70,7 +70,7 @@ Set a **Soft min** or **soft max** option for better control of Y-axis limits. B
**Soft min** and **soft max** settings can prevent blips from turning into mountains when the data is mostly flat, and hard min or max derived from standard min and max field options can prevent intermittent spikes from flattening useful detail by clipping the spikes past a defined point.
You can set standard min/max options to define hard limits of the Y-axis. For more information, refer to [Standard field definitions]({{< relref "../../panels/standard-field-definitions/#max" >}}).
You can set standard min/max options to define hard limits of the Y-axis. For more information, refer to [Configure standard options]({{< relref "../../panels/configure-standard-options/#max" >}}).
![Label example](/static/img/docs/time-series-panel/axis-soft-min-max-7-4.png)

@ -16,7 +16,7 @@ weight: 400
# Graph and color schemes
To set the graph and color schemes, refer to [Apply color to series and fields]({{< relref "../../panels/working-with-panels/apply-color-to-series/" >}}).
To set the graph and color schemes, refer to [Color scheme]({{< relref "../../panels/configure-standard-options/#color-scheme" >}}).
## Classic palette

@ -83,7 +83,7 @@ Fill opacity set to 95:
### 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 field option. For more information, refer to [Apply color to series and fields]({{< relref "../../panels/working-with-panels/apply-color-to-series/" >}}).
Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard color scheme field option. For more information, refer to [Color scheme]({{< relref "../../panels/configure-standard-options/#color-scheme" >}}).
Gradient appearance is influenced by the **Fill opacity** setting. In the screenshots below, **Fill opacity** is set to 50.
@ -107,7 +107,7 @@ Gradient color is generated based on the hue of the line color.
#### Scheme
In this mode the whole bar will use a color gradient defined by your Color scheme. For more information, refer to [Apply color to series and fields]({{< relref "../../panels/working-with-panels/apply-color-to-series/" >}}). There is more information on this option in [Graph and color scheme]({{< relref "graph-color-scheme/" >}}).
In this mode the whole bar will use a color gradient defined by your color scheme. For more information, refer to [Color scheme]({{< relref "../../panels/configure-standard-options/#color-scheme" >}}). There is more information on this option in [Graph and color scheme]({{< relref "graph-color-scheme/" >}}).
{{< figure src="/static/img/docs/time-series-panel/gradient_mode_scheme_bars.png" max-width="1200px" caption="Gradient color scheme mode" >}}

@ -89,7 +89,7 @@ Fill opacity set to 95:
### 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 field option. For more information, refer to [Apply color to series and fields]({{< relref "../../panels/working-with-panels/apply-color-to-series/" >}}) .
Set the mode of the gradient fill. Fill gradient is based on the line color. To change the color, use the standard color scheme field option. For more information, refer to [Color scheme]({{< relref "../../panels/configure-standard-options/#color-scheme" >}}).
Gradient appearance is influenced by the **Fill opacity** setting. In the screenshots below, **Fill opacity** is set to 50.
@ -113,13 +113,13 @@ Gradient color is generated based on the hue of the line color.
#### Scheme
In this mode the whole line will use a color gradient defined by your Color scheme. For more information, refer to [Apply color to series and fields]({{< relref "../../panels/working-with-panels/apply-color-to-series/" >}}). There is more information on this option in [Graph and color scheme]({{< relref "graph-color-scheme/" >}}).
In this mode the whole line will use a color gradient defined by your Color scheme. For more information, refer to [Color scheme]({{< relref "../../panels/configure-standard-options/#color-scheme" >}}). There is more information on this option in [Graph and color scheme]({{< relref "graph-color-scheme/" >}}).
{{< figure src="/static/img/docs/time-series-panel/gradient_mode_scheme_line.png" max-width="1200px" caption="Gradient mode scheme" >}}
### Line style
Set the style of the line. To change the color, use the standard color scheme field option. For more information, refer to [Apply color to series and fields]({{< relref "../../panels/working-with-panels/apply-color-to-series/" >}})
Set the style of the line. To change the color, use the standard color scheme field option. For more information, refer to [Color scheme]({{< relref "../../panels/configure-standard-options/#color-scheme" >}}).
Line style appearance is influenced by the **Line width** and **Fill opacity** settings. In the screenshots below, **Line width** is set to 3 and **Fill opacity** is set to 20.

Loading…
Cancel
Save