[comment]: # ({e3decbd5-167707a1})
# 9 图表

[comment]: # ({/e3decbd5-167707a1})

[comment]: # ({bd8ad980-21bacb3e})
#### 概述

图形小部件get提供了一种现代化且多功能的数据可视化方式，通过使用矢量图像绘制技术来展示Zabbix收集的数据。该图形小部件get自Zabbix 4.0起支持。请注意，Zabbix 4.0之前支持的图形小部件get仍然可以作为[Graph
(classic)](/manual/web_interface/frontend_sections/dashboards/widgets/graph_classic)使用。更多详细信息，请参见*仪表盘*页面上的[添加部件](/manual/web_interface/frontend_sections/dashboards#添加部件)部分。

[comment]: # ({/bd8ad980-21bacb3e})

[comment]: # ({01e38353-b1257d27})
#### 配置

要进行配置，请选择 *图形* 作为类型：

![](../../../../../../assets/en/manual/web_interface/frontend_sections/monitoring/graph_dataset.png){width="600"}

[comment]: # ({/01e38353-b1257d27})

[comment]: # ({209a8d98-d1f705fb})
#### 数据集

**数据集**选项卡允许通过添加数据集来选择图形的数据。
可以添加两种类型的数据集：

-   *监控项模式* - 显示匹配监控项的数据。图形会为每个监控项使用同一颜色的不同深浅来绘制。
-   *监控项列表* - 显示所选监控项的数据。图形会为每个监控项使用不同颜色来绘制。

默认会添加一个 *监控项模式* 数据集。

|   |   |   |
|-|----------|----------------------------------------|
|*数据集*|<|对于 **监控项模式** 数据集：<br>选择或输入主机和监控项模式；与这些模式匹配的监控项数据将显示在图形上；最多可显示 50 个监控项。<br>可使用通配符模式进行选择（例如，`*` 将返回匹配零个或多个字符的结果）。<br>要指定通配符模式，请手动输入字符串并按 *Enter*。<br>通配符符号始终会被解释，因此例如在存在其他匹配监控项（如 *item2*、*item3*）时，无法单独添加名为 *item\** 的监控项。<br>对于“监控项模式”数据集，必须指定主机和监控项模式。<br>另请参见：[数据集配置详情](#data-set-configuration-details)。<br><br>对于 **监控项列表** 数据集：<br>通过单击 *添加监控项* 按钮选择图形的监控项。<br>自 Zabbix 7.0.1 起，还可以通过单击 *添加 widget* 按钮，将兼容的 widget 作为监控项的[数据源](/manual/web_interface/frontend_sections/dashboards/widgets#dynamic-parameters)进行选择。<br>对于“监控项列表”数据集，必须指定监控项或 widget。<br>另请参见：[数据集配置详情](#data-set-configuration-details)。<br><br>请注意，只允许使用数值类型的监控项。<br><br>在[模板仪表板](/manual/config/templates/template#adding-dashboards)上配置 widget 时，用于指定主机模式的参数不可用，而用于指定监控项列表的参数只能选择[在模板上配置的监控项](/manual/config/templates/template#adding-items-triggers-graphs)。|
| |*绘制*|选择指标的绘制类型。<br>可选的绘制类型：*Line*（默认）、*Points*、*Staircase* 和 *Bar*。<br>请注意，如果线/阶梯图中只有一个数据点，则无论绘制类型如何，都会将其绘制为点。点大小根据线宽计算，但即使线宽更小，也不会小于 3 像素。|
|^|*堆叠*|勾选此复选框可将数据以堆叠方式显示（显示填充区域）。<br>当选择 *Points* 绘制类型时，此选项不可用。|
|^|*宽度*|设置线宽。<br>当选择 *Line* 或 *Staircase* 绘制类型时，此选项可用。|
|^|*点大小*|设置点大小。<br>当选择 *Points* 绘制类型时，此选项可用。|
|^|*透明度*|设置透明度级别。|
|^|*填充*|设置填充级别。<br>当选择 *Line* 或 *Staircase* 绘制类型时，此选项可用。|
|^|*缺失数据*|选择缺失数据的显示方式：<br>**None** - 保持空白间隙；<br>**Connected** - 连接两个边界值；<br>**Treat as 0** - 将缺失数据显示为 0 值；<br>**Last known** - 将缺失数据显示为与最后已知值相同的值；不适用于 *Points* 和 *Bar* 绘制类型。|
|^|*Y 轴*|选择图形中显示 Y 轴的一侧。|
|^|*时间偏移*|如有需要，请指定时间偏移。<br>此字段可使用[时间后缀](/manual/appendix/suffixes#time-suffixes)。允许使用负值。|
|^|*聚合函数*|指定在所选 *聚合间隔* 内对每个监控项或整个数据集使用的聚合函数：<br>**min** - 显示最小值；<br>**max** - 显示最大值；<br>**avg** - 显示平均值；<br>**sum** - 显示总和；<br>**count** - 显示值的数量；<br>**first** - 显示第一个值；<br>**last** - 显示最后一个值。<br>如果选择 **not used**，则显示所有值（不进行聚合）。<br><br>只有数值数据才能用于 *min*、*max*、*avg* 和 *sum*。对于 *count*，非数值数据将转换为数值。<br>另请参见：[图形中的聚合](#aggregation-in-graphs)。|
|^|*聚合间隔*|指定聚合值的时间间隔。<br>此字段可使用[时间后缀](/manual/appendix/suffixes#time-suffixes)。不带后缀的数值将视为秒。<br><br>请注意，如果 widget 配置为基于[趋势](/manual/config/items/history_and_trends#keeping-trends)显示历史数据（*History data selection* 设置为 *Trends* 或 *Auto*），建议使用 1 小时的整数倍作为聚合间隔（例如 3600、60m、1h、3h 等）。趋势会存储按小时聚合的值，因此使用不是 1 小时整数倍的聚合间隔（例如 100s、7min、15min、90min 等）可能会导致结果难以解释。|
|^|*聚合*|指定是否进行聚合：<br>**Each item** - 数据集中的每个监控项都会分别聚合并显示；<br>**Data set** - 所有数据集监控项将聚合并显示为一个值。|
|^|*近似*|指定当每个垂直图形像素对应多个值时显示哪个值：<br>**all** - 显示最小值、最大值和平均值；<br>**min** - 显示最小值；<br>**max** - 显示最大值；<br>**avg** - 显示平均值。<br><br>当显示较长时间范围且更新间隔较短的图形时，此设置很有用（例如，按 10 分钟采集一次的一年数据）。|
|^|*数据集标签*|指定在图形 *数据集* 配置中以及图形 *图例* 中显示的数据集标签（适用于聚合数据集）。<br>所有数据集都会编号，包括已指定 *数据集标签* 的数据集。如果未指定标签，系统将根据编号自动为数据集命名（例如 "Data set #2"、"Data set #3" 等）。在重新排序/拖动数据集后，会重新计算数据集编号。<br>过长的数据集标签会被缩短以适应显示位置（例如 "Number of proc..."）。|

[comment]: # ({/209a8d98-d1f705fb})

[comment]: # ({d1ccde1d-63c8cd81})
##### 数据集配置详情

现有的数据集以列表形式显示。您可以：

-   单击 ![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/move_icon.png) 移动图标并将数据集拖动到列表中的新位置。
-   单击 ![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/expand_icon.png) 展开图标以展开数据集详细信息。展开后，该图标会变为 ![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/collapse_icon.png) 收缩图标。
-   单击 ![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/color_icon.png) 颜色图标以更改颜色，可以通过颜色选择器或手动更改。对于 *监控项 模式* 数据集，颜色用于为每个 监控项 计算不同的色阶。对于 *监控项 列表* 数据集，颜色用于指定的 监控项。
-   单击 *添加新数据集* 按钮以添加一个空数据集，允许选择 主机 和 监控项 模式。
    如果单击 *添加新数据集* 按钮旁边的向下箭头图标，则会显示一个下拉菜单，允许您添加新的 *监控项 模式* 或 *监控项 列表* 数据集，或者 *克隆* 当前打开的数据集。如果所有数据集都已折叠，则 *克隆* 选项不可用。

![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/graph_dataset_add.png)

[comment]: # ({/d1ccde1d-63c8cd81})

[comment]: # ({253be0c6-4bf7d5e9})
**监控项模式**数据集包含 *主机模式* 和 *监控项模式* 字段，这两个字段都支持识别完整名称或包含通配符符号（\*）的模式。
此功能允许您选择所有包含所选模式的主机名称和监控项名称。
在 *监控项模式* 字段中输入监控项名称或监控项模式时，下拉列表中只会显示属于所选主机名称的监控项。

例如，在 *主机模式* 字段中输入模式 **z\*** 后，下拉列表会显示所有包含该模式的主机名称：**z\*, Zabbix server, Zabbix proxy**。
按下 *Enter* 后，该模式会被接受并显示为 **z\***。
同样，在 *监控项模式* 字段中输入模式 **a\*** 后，下拉列表会显示所有包含该模式的监控项名称：**a\*, Available memory, Available memory in %**。

![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/widgets/graph_widget_it_host_pattern_1.png){width="600"}

按下 *Enter* 后，该模式会被接受并显示为 **a\***。随后，图形会显示属于所选主机名称的所有监控项。

![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/widgets/graph_widget_it_host_pattern_2.png){width="600"}

[comment]: # ({/253be0c6-4bf7d5e9})

[comment]: # ({259b6979-e1c76a52})
**监控项列表**数据集包含*添加 监控项*按钮，允许您添加监控项以显示在图表上。  
自Zabbix 7.0.1起，您还可以通过点击*添加小部件*按钮，添加兼容的小部件作为监控项的[动态参数](/manual/web_interface/frontend_sections/dashboards/widgets#动态参数)。

![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/widgets/graph_widget_it_item_list_1.png){width="600"}

例如，点击*添加 监控项*按钮将打开一个弹出窗口，其中包含一个*主机*参数。  
选择一个主机后，所有可用于选择的监控项将显示在一个列表中。  
在选择一个或多个监控项后，它们将显示在数据集监控项列表中以及图表上。

![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/widgets/graph_widget_it_item_list_2.png){width="600"}

[comment]: # ({/259b6979-e1c76a52})

[comment]: # ({d51460cb-7d63e879})
##### 图表中的聚合

聚合允许在指定的时间间隔（5 分钟、1 小时、1 天等）内显示聚合值（最小值、最大值、平均值等），而不是显示所有单独的值。
在一个数据集中，聚合既可以分别应用于每个监控项，也可以应用于整个数据集。

聚合函数的一些使用场景如下：
-   每天 Nginx 服务器的平均请求数。
-   每周各集群中最少的磁盘空间。

在下面的示例中，"max" 聚合函数应用于时间间隔为 5 分钟的监控项：

![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/widgets/graph_aggregate_options.png)

该示例展示了 5 分钟内的最大 CPU 负载（由 1 分钟平均值聚合而来），并与 5 分钟内的平均 CPU 负载进行比较。

![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/widgets/graph_widget_aggregation.png){width="600"}

当为图例选择 *显示聚合函数* 时，监控项会以括号形式显示，并在图例和工具提示中以前缀形式显示聚合函数。
如果为图表指定了 *数据集标签*，则该标签会以括号形式显示，并以前缀形式显示聚合函数。

[comment]: # ({/d51460cb-7d63e879})

[comment]: # ({3f8a826e-efef79c8})
#### 显示选项

**显示选项** 选项卡允许定义历史数据选择：

![](../../../../../../assets/en/manual/web_interface/frontend_sections/monitoring/graph_displaying_options.png)

|   |   |
|--|--------|
|*历史数据选择*|设置图形数据来源：<br>**Auto** - 数据根据经典图形 [algorithm](/manual/config/visualization/graphs/simple#generating-from-historytrends) 自动获取（默认）；<br>**History** - 来自历史数据；<br>**Trends** - 来自趋势数据。|
|*简单触发器*|勾选此复选框可显示简单触发器的触发器阈值。阈值将使用触发器严重性颜色绘制为虚线。<br>简单触发器是指在表达式中针对一个监控项只使用一个函数（仅 `last`、`max`、`min`、`avg`）的触发器。<br>最多可绘制三个触发器。请注意，触发器必须位于绘制范围内才可见。|
|*工作时间*|勾选此复选框可在图形上显示工作时间。工作时间（工作日）在图形中以白色背景显示，而非工作时间以灰色显示（使用 *Original blue* 默认前端主题时）。|
|*百分位线（左）*|勾选此复选框并输入百分位值，可在图形左侧 Y 轴上以线条形式显示指定百分位。<br>例如，如果设置为 95% 百分位，则百分位线将位于 95% 的值落在其下方的位置。|
|*百分位线（右）*|勾选此复选框并输入百分位值，可在图形右侧 Y 轴上以线条形式显示指定百分位。<br>例如，如果设置为 95% 百分位，则百分位线将位于 95% 的值落在其下方的位置。|

[comment]: # ({/3f8a826e-efef79c8})

[comment]: # ({2d41b758-a747b952})
#### 时间段

“**时间段**”选项卡允许设置在图表中显示数据的时间段：

![](../../../../../../assets/en/manual/web_interface/frontend_sections/monitoring/graph_time_period.png)

|     |     |
|--|--------|
| *时间周期* | 选择 [动态参数](/manual/web_interface/frontend_sections/dashboards/widgets#动态参数) 作为时间周期：<br>**仪表板** - 将 *时间周期* 选择器设置为数据源；<br>**小部件get** - 将 *小部件* 参数中指定的兼容小部件get 设置为数据源；<br>**自定义** - 将 *从* 和 *至* 参数中指定的时间周期设置为数据源；如果设置，将在小部件的 Top 右上角显示一个时钟图标，鼠标悬停时显示设置的时间。 |
| *小部件* | 输入或选择一个兼容的小部件get作为时间段的数据源。<br>如果将*时间段*设置为“小部件”，则此参数可用。 |
| *起始时间* | 输入或选择时间段的开始时间。<br>支持[Relative time syntax](/manual/web_interface/time_period_selector)（例如：now、now/d、now/w-1w等）。<br>当 *时间段* 设置为 "自定义" 时，此参数可用。 |
| *至* | 输入或选择时间段的结束时间。<br>支持[Relative time syntax](/manual/web_interface/time_period_selector)（例如：now、now/d、now/w-1w等）。<br>当*时间周期*设置为“自定义”时，此参数可用。 |

[comment]: # ({/2d41b758-a747b952})

[comment]: # ({c50c2a8e-ec3778fa})
#### 坐标轴
**坐标轴**选项卡允许自定义坐标轴的显示方式：

![](../../../../../../assets/en/manual/web_interface/frontend_sections/monitoring/graph_axes.png)

|     |     |
|--|--------|
| *左侧Y轴* | 勾选此复选框以显示左侧Y轴。<br>如果在*数据集*或*覆盖*选项卡中未选中，则该复选框可能会被禁用。 |
| *右侧Y轴* | 勾选此复选框以显示右侧Y轴。<br>如果在*数据集*或*覆盖*选项卡中未选中，则该复选框可能会被禁用。 |
| *X轴* | 取消勾选此复选框以隐藏X轴（默认已勾选）。 |
| *最小值* | 设置相应坐标轴的最小值。<br>指定Y轴可见范围的最小值。 |
| *最大值* | 设置相应坐标轴的最大值。<br>指定Y轴可见范围的最大值。 |
| *单位* | 从下拉菜单中选择图形坐标轴值的单位。<br>如果选择*自动*选项，则使用相应坐标轴上第一个监控项的单位显示坐标轴值。<br>*静态*选项允许您为相应坐标轴分配自定义名称。如果选择*静态*选项且*值*输入框留空，则相应坐标轴的名称将仅包含数值。 |

[comment]: # ({/c50c2a8e-ec3778fa})

[comment]: # ({ed8b5c97-b12a63bc})
#### 图例

**图例**选项卡允许自定义图形图例：

![](../../../../../../assets/en/manual/web_interface/frontend_sections/monitoring/graph_legend.png){width="600"}

|     |     |
|--|--------|
| *显示图例* | 取消勾选此复选框以在图形上隐藏图例（默认已勾选）。 |
| *显示最小/平均/最大值* | 勾选此复选框以在图例中显示监控项的最小值、平均值和最大值。 |
| *显示聚合函数* | 勾选此复选框以在图例中显示聚合函数。 |
| *行数* | 选择图例行的显示模式：<br>**固定** - 显示的行数由 *行数* 参数值决定；<br>**可变** - 显示的行数由配置的监控项数量决定，但不超过 *最大行数* 参数值。 |
| *行数/*<br>*最大行数* | 如果 *行数* 设置为“固定”，则设置要显示的图例行数 (1-10)。<br>如果 *行数* 设置为“可变”，则设置要显示的最大图例行数 (1-10)。 |
| *列数* | 设置要显示的图例列数 (1-4)。<br>如果取消勾选 *显示最小/平均/最大值*，此参数可用。 |

[comment]: # ({/ed8b5c97-b12a63bc})

[comment]: # ({e0d21e71-07ed8642})
#### 问题

**问题**选项卡允许自定义问题显示：

![](../../../../../../assets/en/manual/web_interface/frontend_sections/monitoring/graph_problems.png){width="600"}

|     |     |
|--|--------|
| *显示问题* | 勾选此复选框以在图表上启用问题显示（默认未勾选，即禁用）。 |
| *仅选中的监控项* | 勾选此复选框以仅在图表上显示所选监控项的问题。 |
| *问题主机* | 选择要在图表上显示的问题主机。<br><br>可以使用通配符模式（例如，`*`将返回匹配零个或多个字符的结果）。<br>要指定通配符模式，只需手动输入string并按下*Enter*键。<br>在输入时，请注意下拉菜单中显示的所有匹配的主机。<br><br>在配置widget于[添加仪表板](/manual/config/templates/template#添加仪表板)上时，此参数不可用。 |
| *严重性* | 勾选问题严重性以过滤要在图表上显示的问题。<br>如果没有勾选任何严重性，则显示所有问题。 |
| *问题* | 指定要在图表上显示的问题名称。 |
| *问题标签* | 指定问题标签以限制小部件中显示的问题数量。<br>可以包含也可以排除特定标签和标签值。可以设置多个条件。标签名称匹配始终区分大小写。<br><br>每个条件可用以下运算符：<br>**存在** - 包含指定的标签名称；<br>**等于** - 包含指定的标签名称和值（区分大小写）；<br>**包含** - 包含指定的标签名称，其中标签值包含输入的string（子串匹配，不区分大小写）；<br>**不存在** - 排除指定的标签名称；<br>**不等于** - 排除指定的标签名称和值（区分大小写）；<br>**不包含** - 排除指定的标签名称，其中标签值包含输入的string（子串匹配，不区分大小写）。<br><br>条件有两种计算类型：<br>**And/Or** - 所有条件必须满足，相同标签名称的条件将通过*Or*条件分组；<br>**Or** - 只需满足任一条件。 |

[comment]: # ({/e0d21e71-07ed8642})

[comment]: # ({226e80ec-bb195e90})
#### 覆盖

**覆盖** 选项卡允许为数据集添加自定义覆盖：

![](../../../../../../assets/en/manual/web_interface/frontend_sections/monitoring/graph_overrides.png){width="600"}

当使用 `*` 通配符为一个数据集选择了多个监控项，并且您希望更改这些监控项的默认显示方式时，覆盖非常有用（例如，默认基础颜色或其他任何属性）。

现有的覆盖（如果有）会以列表形式显示。要添加新的覆盖：

-   单击
    ![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/add_override.png)
    按钮
-   选择用于覆盖的主机和监控项。或者，您也可以输入主机和监控项模式。可以使用通配符模式（例如，`*` 将返回匹配零个或多个字符的结果）。要指定通配符模式，只需手动输入字符串并按 *Enter*。在输入时，请注意所有匹配的主机都会显示在下拉列表中。通配符符号始终会被解释，因此例如，如果存在其他匹配的监控项（如 item2、item3），则无法单独添加名为 "item\*" 的监控项。主机模式和监控项模式参数是必填项。
    在配置 [模板仪表板](/manual/config/templates/template#adding-dashboards) 上的小部件时，用于指定主机模式的参数不可用。
    在配置 [模板仪表板](/manual/config/templates/template#adding-dashboards) 上的小部件时，用于指定监控项列表的参数只允许选择[在模板上配置的监控项](/manual/config/templates/template#adding-items-triggers-graphs)。
-   单击
    ![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/add_override2.png)，
    以选择覆盖参数。至少应选择一个覆盖参数。有关参数说明，请参见上面的 *数据集* 选项卡。

图形小部件显示的信息可以使用 [小部件菜单](/manual/web_interface/frontend_sections/dashboards#widget-menu) 下载为 .png 图像：

![](../../../../../../assets/en/manual/web_interface/frontend_sections/dashboards/graph_widget_as_png.png)

小部件的截图将保存到 Downloads 文件夹。

[comment]: # ({/226e80ec-bb195e90})
