本文属于机器翻译版本。若本译文内容与英语原文存在差异，则一律以英文原文为准。

# 图形样式
<a name="v10-time-series-graph"></a>

****  
本文档主题专为支持 **Grafana 10.x 版本**的 Grafana 工作区而设计。  
对于支持 Grafana 9.x 版本的 Grafana 工作区，请参阅[使用 Grafana 版本 9](using-grafana-v9.md)。  
对于支持 Grafana 8.x 版本的 Grafana 工作区，请参阅[使用 Grafana 版本 8](using-grafana-v8.md)。

可使用此选项定义如何显示时间序列数据。您可以使用覆盖在同一个图形中组合多种样式。
+ **线**：在图形上将时间序列显示为一条线。
+ **条形图**：将时间序列显示为图形上的一系列条形图，每个条形图对应一个数据点。
+ **点**：将时间序列显示为图形上的一系列点，每个点对应一个数据点。

## 条形图对齐
<a name="v10-time-series-graph-bar"></a>

设置条形图相对于数据点的位置（该点将绘制在图形上）。由于条形图具有宽度，可将其放置在点的前面、后面或居中。适用的选项包括：
+ ![\[An image showing a bar graph aligned before a point.\]](http://docs.aws.amazon.com/zh_cn/grafana/latest/userguide/images/viz/bar-alignment-before.png) **前**：条形图绘制在点之前。该点放置在条形图的尾角。
+ ![\[An image showing a bar graph aligned around a point.\]](http://docs.aws.amazon.com/zh_cn/grafana/latest/userguide/images/viz/bar-alignment-center.png) **居中**：条形图围绕该点绘制。该点放置在条形图的中央。这是默认值。
+ ![\[An image showing a bar graph aligned after a point.\]](http://docs.aws.amazon.com/zh_cn/grafana/latest/userguide/images/viz/bar-alignment-after.png) **后**：条形图绘制在点之后。该点放置在条形图的前角。

## 线宽
<a name="v10-time-series-graph-linewidth"></a>

线宽是一个滑块，用于控制系列线条的粗细或条形图的轮廓。

## 填充不透明度
<a name="v10-time-series-graph-fill"></a>

设置填充颜色的不透明度。例如，填充用于显示折线图中线条下方的区域，或用作条形图中条形的颜色。

## 渐变模式
<a name="v10-time-series-graph-gradient"></a>

渐变模式指定渐变填充，该填充基于序列颜色。要更改颜色，请使用标准颜色方案字段选项。有关更多信息，请参阅 [颜色方案](v10-panels-configure-standard-options.md#v10-panels-standard-options-color-scheme)。

渐变模式选项包括：
+ **无**：无渐变填充。这是默认设置。
+ **不透明度**：一种不透明度渐变，其中填充的不透明度随着 Y 轴值的增加而增加。
+ **色调**：一种基于序列色调的微渐变。
+ **方案**：由您的颜色方案定义的颜色渐变。该设置用于填充区域和线条。有关更多信息，请参阅 [颜色选项](v10-time-series-color.md)。

渐变外观受**填充不透明度**设置的影响。

## 显示点
<a name="v10-time-series-graph-showpoints"></a>

您可以使用以下选项将可视化配置为向线条或条形图添加点。
+ **自动**：Grafana 根据数据的密度决定是否显示点。当密度较低时，
+ **始终**：无论数据密度如何，都会显示点。
+ **从不**：不显示点。

## 点大小
<a name="v10-time-series-graph-pointsize"></a>

设置点的大小，直径从 1 到 40 像素不等。

## 线插值
<a name="v10-time-series-graph-interpolation"></a>

选择 Grafana 插入序列线的方式。

![\[显示 Grafana 中在点之间绘制线条的不同方式的图像。\]](http://docs.aws.amazon.com/zh_cn/grafana/latest/userguide/images/viz/line-interpolation.png)


选项包括：
+ **线性**：点由直线连接。
+ **平滑**：点由曲线连接，曲线可平滑点之间的过渡。
+ **前一步**：线条显示为点之间的步长。点在步结束时渲染。
+ **后一步**：线条显示为点之间的步长。点在步开始时渲染。

## 线型
<a name="v10-time-series-graph-linestyle"></a>

设置线条样式。要更改颜色，请使用标准颜色方案字段选项。

线条样式的选择有：
+ **实线**：显示实线。这是默认设置。
+ **虚线**：显示虚线。选择此选项时，会出现一个列表，供您选择虚线的长度和间隙（长度、间隙）。默认情况下，虚线间距设置为 10。
+ **点**：显示虚线。选择此选项时，会出现一个列表，供您选择点间距的间隙长度。默认情况下，点间距设置为 10。

## 连接 null 值
<a name="v10-time-series-graph-null"></a>

选择 null 值（数据中的间隙）在图形上的显示方式。可将 null 值连接起来形成一条连续的线，也可以设置一个阈值，如果超过该阈值，数据间隙将不再连接。

连接 null 值的选项有：
+ **从不**：数据中存在间隙的时间序列数据点从不连接。
+ **始终**：数据中存在间隙的时间序列数据点始终连接。
+ **阈值**：指定一个阈值，如果超过该阈值，数据间隙将不再连接。当数据中连接的间隙大小已知或在已知范围内时，这种方法会很有用，超出此范围的间隙不应再连接。

## 断开值连接
<a name="v10-time-series-graph-disconnect"></a>

选择是否在数据中的值之间添加间隔，以使这些值之间的间隔超过指定的阈值。

断开值连接的选项有：
+ **从不**：时间序列数据点从不断开连接。
+ **阈值**：指定一个阈值，如果超过该阈值，数据中的值将断开连接。当数据中所需的值具有已知的大小或在已知范围内时，这种方法会很有用，超出此范围的值不应再连接。

## 堆栈序列
<a name="v10-time-series-graph-stack"></a>

*堆叠*允许 Grafana 相互叠加显示序列。在可视化中使用堆叠时要小心，因为很容易创建误导性图形。要了解为什么堆叠可能不是最佳方法的更多信息，请参阅[堆叠问题](https://www.data-to-viz.com/caveat/stacking.html)。

堆叠的选项有：
+ **关闭**：关闭序列堆叠。
+ **正常**：将序列堆叠在一起。
+ **100%**：按百分比堆叠，其中所有序列相加为 100%。

**分组堆叠序列**

您可以覆盖堆叠行为以分组堆叠序列。有关创建覆盖的更多信息，请参阅 [配置字段覆盖](v10-panels-configure-overrides.md)。

**分组堆叠序列**

1. 编辑面板并选择**覆盖**。

1. 为**堆栈系列**选项创建字段覆盖。

1. 在堆叠模式下，选择**正常**。

1. 为您希望序列显示在其中的堆叠组命名。

   堆叠组名称选项仅在您创建覆盖时可用。

## 填充至下方
<a name="v10-time-series-graph-fillbelow"></a>

**填充至下方**选项填充两个序列之间的区域。此选项仅以序列或字段覆盖形式提供。

使用此选项，您可以填充两个序列之间的区域，而不是从序列线向下填充到 0。例如，如果您有两个名为 *Max* 和 *Min* 的序列，您可以选择 *Max* 序列并将其覆盖，以**填充至下方** *Min* 序列。这将仅填充两条序列线之间的区域。