# Time series panel **** This documentation topic is designed for Grafana workspaces that support **Grafana version 8.x**. For Grafana workspaces that support Grafana version 12.x, see [Working in Grafana version 12](using-grafana-v12.md). For Grafana workspaces that support Grafana version 10.x, see [Working in Grafana version 10](using-grafana-v10.md). For Grafana workspaces that support Grafana version 9.x, see [Working in Grafana version 9](using-grafana-v9.md). The time series panel can render a time series 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. **Note** You can migrate Graph panel visualizations to Time series visualizations. To migrate, on the **Panel** tab, choose **Time series visualization**. Grafana transfers all applicable settings. Time series visualizations enable you to apply the following options: + [Transformations](panel-transformations.md) + [Field options and overrides](field-options-overrides.md) + [Thresholds](thresholds.md) You can also use field options to create different types of graphs or adjust your axes. Use these settings to refine your visualization. ## Tooltip mode When you hover your cursor over the graph, Grafana can display tooltips. Choose how tooltips behave: + **Single** – The hover tooltip shows only the series that you are hovering over. + **All** – The hover tooltip shows all the series in the graph. Grafana highlights the series that you are hovering over in bold in the series list in the tooltip. + **Hidden** – Do not display the tooltip. ## Legend mode and placement Choose how the legend appears. + **List** – Displays the legend as a list. This is the default. + **Table** – Displays the legend as a table. + **Hidden** – Hides the legend. Choose where to display the legend. + **Bottom** – Below the graph. + **Right** – To the right of the graph. ## Legend calculations Choose which calculations to show in the legend. For more information, see [Calculations list](list-of-calculations.md). # Graph time series as lines **** This documentation topic is designed for Grafana workspaces that support **Grafana version 8.x**. For Grafana workspaces that support Grafana version 12.x, see [Working in Grafana version 12](using-grafana-v12.md). For Grafana workspaces that support Grafana version 10.x, see [Working in Grafana version 10](using-grafana-v10.md). For Grafana workspaces that support Grafana version 9.x, see [Working in Grafana version 9](using-grafana-v9.md). This section explains how to use Time series field options to visualize time series data as lines and illustrates what the options do. **Create the panel** 1. Create a panel, selecting the **Time series** visualization. For more information, see [Adding a panel](add-a-panel-to-a-dashboard.md). 1. In the **Panel editor**, choose **Field**. 1. In **Style**, choose **Lines**. ## Style the lines There are a variety of options for styling the lines. + **Line interpolation** – Choose how Grafana interpolates the series line. The choices are **Linear**, **Smooth**, **Step before**, and **Step after**. + **Line width** – Set the line thickness between 0 and 10 pixels. + **Fill opacity** – Set the opacity of the series fill, from 0 to 100 percent. + **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. Gradient appearance is influenced by the setting for **Fill opacity**. The choices for gradient fill are **None**, **Opacity**, and **Hue**. With **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. With **Hue**, the gradient color is generated based on the hue of the line color. + **Line style** – Set the style of the line. To change the color, use the standard color scheme field option. Line style appearance is influenced by the settings for **Line width** and **Fill opacity**. The choices for line style are **Solid**, **Dash**, and **Dots**. + **Null values** – Choose how gaps in the data are displayed. 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. You can choose to **Never** connect data points with gaps, **Always** connect data points with gaps, or set a **Threshold** at which gaps in the data should no longer be connected. + **Show points** – Choose when the points should be shown on the graph. The choices are **Auto**, **Always**, and **Never**. ## Fill below to This option is available only in the overrides tab. **To fill the area between two series** 1. Select the fields to fill below. 1. In **Add override property**, choose **Fill below to**. 1. Select the series that you want the fill to stop at. # Graph time series as bars **** This documentation topic is designed for Grafana workspaces that support **Grafana version 8.x**. For Grafana workspaces that support Grafana version 12.x, see [Working in Grafana version 12](using-grafana-v12.md). For Grafana workspaces that support Grafana version 10.x, see [Working in Grafana version 10](using-grafana-v10.md). For Grafana workspaces that support Grafana version 9.x, see [Working in Grafana version 9](using-grafana-v9.md). This section explains how to use Time series field options to visualize time series data as bars and illustrates what the options do. **Create the panel** 1. Create a panel, selecting the **Time series** visualization. For more information, see [Adding a panel](add-a-panel-to-a-dashboard.md). 1. In the **Panel editor**, choose **Field**. 1. In **Style**, choose **Bars**. ## Style the bars There are a variety of options for styling the bars. + **Bar alignment** – Set the position of the bar relative to a data point. The choices are **Before**, **Center**, and **After**. + **Line width** – Set the thickness of the bar outlines between 0 and 10 pixels. + **Fill opacity** – Set the opacity of the bar fill, from 0 to 100 percent. + **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. Gradient appearance is influenced by the setting for **Fill opacity**. The choices for gradient fill are **None**, **Opacity**, and **Hue**. With **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. With **Hue**, the gradient color is generated based on the hue of the line color. + **Show points** – Choose when the points should be shown on the graph. The choices are **Auto**, **Always** and **Never**. # Graph time series as points **** This documentation topic is designed for Grafana workspaces that support **Grafana version 8.x**. For Grafana workspaces that support Grafana version 12.x, see [Working in Grafana version 12](using-grafana-v12.md). For Grafana workspaces that support Grafana version 10.x, see [Working in Grafana version 10](using-grafana-v10.md). For Grafana workspaces that support Grafana version 9.x, see [Working in Grafana version 9](using-grafana-v9.md). This section explains how to use Time series field options to visualize time series data as points and illustrates what the options do. **Create the panel** 1. Create a panel, selecting the **Time series** visualization. For more information, see [Adding a panel](add-a-panel-to-a-dashboard.md). 1. In the **Panel editor**, choose **Field**. 1. In **Style**, choose **Points**. ## Style the points When you graph as points, you can choose the point size. + **Point size** – Choose the point size, between 1 and 40 pixels in diameter. # Change axis display **** This documentation topic is designed for Grafana workspaces that support **Grafana version 8.x**. For Grafana workspaces that support Grafana version 12.x, see [Working in Grafana version 12](using-grafana-v12.md). For Grafana workspaces that support Grafana version 10.x, see [Working in Grafana version 10](using-grafana-v10.md). For Grafana workspaces that support Grafana version 9.x, see [Working in Grafana version 9](using-grafana-v9.md). This section explains how to use Time series field options to control the display of axes in the visualization and illustrates what the axis options do. There are a variety of options for the axes. + **Y-axis placement** – Set the placement of the y-axis. The choices are **Left**, **Right**, and **Hidden**. + **Y-axis label** – Set a text label for the y-axis. If you have more than one y-axis, you can use the **Override** tab to assign them different labels. + **Width** – Set the fixed width of the axis. By default, the Grafana workspace dynamically calculates the axis width. 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** for better control of y-axis limits. By default, the Grafana workspace sets the range for the y-axis automatically based on the data. **Soft min** or **Soft max** settings can prevent blips from appearing as 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. + **Scale** – Set the scale to use for y-axis values. The choices are **Linear** and **Logarithmic**. # Graph stacked time series **** This documentation topic is designed for Grafana workspaces that support **Grafana version 8.x**. For Grafana workspaces that support Grafana version 12.x, see [Working in Grafana version 12](using-grafana-v12.md). For Grafana workspaces that support Grafana version 10.x, see [Working in Grafana version 10](using-grafana-v10.md). For Grafana workspaces that support Grafana version 9.x, see [Working in Grafana version 9](using-grafana-v9.md). This section explains how to use Time series panel field options to control the stacking of the series and illustrates what the stacking options do. Stacking allows Grafana to display series on top of each other. Be cautious when using stacking in the visualization as it can easily create misleading graphs. You can read more on why stacking might be not the best approach here: [The Issue with Stacking](https://www.data-to-viz.com/caveat/stacking.html). # Stack series in groups **** This documentation topic is designed for Grafana workspaces that support **Grafana version 8.x**. For Grafana workspaces that support Grafana version 12.x, see [Working in Grafana version 12](using-grafana-v12.md). For Grafana workspaces that support Grafana version 10.x, see [Working in Grafana version 10](using-grafana-v10.md). For Grafana workspaces that support Grafana version 9.x, see [Working in Grafana version 9](using-grafana-v9.md). The stacking group option is only available as an override. **To stack series in the same group** 1. In the Overrides section, create a field override for the **Stack series** option. 1. Choose the **Normal** stacking mode. 1. Name the stacking group that you want the series to appear in. The stacking group name option is available only when creating an override.