> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# 面积图

> 仪表盘面积图以填充颜色和堆叠形式展现时间序列数值变化与多维构成，支持基础、堆积和百分比堆积三种类型，适用于销售趋势和资源分配的类别贡献对比。

在仪表盘中，面积图是基于时间序列和多维数据，通过填充颜色、堆叠形式直观展现数值变化与构成的图表。适用于展示销售趋势、资源分配情况的场景，可以快速识别关键数据变化、对比类别贡献。

## 添加面积图

在仪表盘左上角点击  **添加图表** ，在弹窗菜单的图表类型中选择 **面积图** 。

<img src="https://mintcdn.com/dingtalk-8c0f98e2/YwlxKh9vB2sYUnZ_/zh/aitable/dashboards/dashboard-components/area-chart/images/image_LQ7VI2bIKt.png?fit=max&auto=format&n=YwlxKh9vB2sYUnZ_&q=85&s=75319c69da16e8ae39796e9f6bb106bc" alt="" width="1062" height="1162" data-path="zh/aitable/dashboards/dashboard-components/area-chart/images/image_LQ7VI2bIKt.png" />

## 配置面积图

对类型与数据和自定义样式进行配置：

**数据：** 支持选择面积图的数据来源，包括数据表、数据范围，当数据范围选择**全部数据** 时，支持设置筛选条件。

<img src="https://mintcdn.com/dingtalk-8c0f98e2/YwlxKh9vB2sYUnZ_/zh/aitable/dashboards/dashboard-components/area-chart/images/image_YKvy-a8ZbZ.png?fit=max&auto=format&n=YwlxKh9vB2sYUnZ_&q=85&s=d80ca0681901e96a8107db38402f1710" alt="" width="634" height="356" data-path="zh/aitable/dashboards/dashboard-components/area-chart/images/image_YKvy-a8ZbZ.png" />

**图表：** 可以切换图表类型，比如基础面积图、堆积面积图和%堆积面积图；支持设定图表配色。

<img src="https://mintcdn.com/dingtalk-8c0f98e2/YwlxKh9vB2sYUnZ_/zh/aitable/dashboards/dashboard-components/area-chart/images/image_JlDWdrYFh6.png?fit=max&auto=format&n=YwlxKh9vB2sYUnZ_&q=85&s=93890066d5acf1305d0ae6a708b37241" alt="" width="638" height="292" data-path="zh/aitable/dashboards/dashboard-components/area-chart/images/image_JlDWdrYFh6.png" />

**横轴：** 选择横轴字段，设定横轴排序依据（按横轴值、纵轴值或记录顺序）、排序规则（按正序或倒序）。

<img src="https://mintcdn.com/dingtalk-8c0f98e2/YwlxKh9vB2sYUnZ_/zh/aitable/dashboards/dashboard-components/area-chart/images/image_t8BIe9RGi8.png?fit=max&auto=format&n=YwlxKh9vB2sYUnZ_&q=85&s=7501de0087996f52a106590575981cf8" alt="" width="638" height="338" data-path="zh/aitable/dashboards/dashboard-components/area-chart/images/image_t8BIe9RGi8.png" />

**纵轴：** 配置统计方式（统计记录总数或者统计字段数值）、纵轴内容和是否分组聚合。统计方式选择统计记录总数时，仅需设定分组聚合内容（不分组或按哪个字段分组）。统计方式选择统计字段数值时，在设置不分组聚合的情况下，可以添加多个纵轴字段，并分别设定其统计方式（计数、求和、平均值、最大值等），支持对纵轴字段进行移除、上移和下移操作；在设置分组聚合的情况下，仅能添加一个纵轴字段并设定统计方式。此外，在分组聚合的情况下，横轴不支持按纵轴值排序。

<img src="https://mintcdn.com/dingtalk-8c0f98e2/YwlxKh9vB2sYUnZ_/zh/aitable/dashboards/dashboard-components/area-chart/images/image_2zElTSQ6g_.png?fit=max&auto=format&n=YwlxKh9vB2sYUnZ_&q=85&s=ccfce117500f9eaa22e59022aa056b47" alt="" width="640" height="342" data-path="zh/aitable/dashboards/dashboard-components/area-chart/images/image_2zElTSQ6g_.png" />

**注：** 仅字段为数值形式时，才可以设置其统计方式为求和、最大值、最小值和平均数。

**自定义样式：** 可自定义背景颜色、图例位置、数值显示、网格线显示、轴标签显示、重叠数值设置、折线类型、横纵轴显示、横纵轴坐标轴线显示、横纵轴刻度标签显示和横轴标签角度，满足您的个性化配置需求。

<img src="https://mintcdn.com/dingtalk-8c0f98e2/YwlxKh9vB2sYUnZ_/zh/aitable/dashboards/dashboard-components/area-chart/images/image_lefQDeeCu0.png?fit=max&auto=format&n=YwlxKh9vB2sYUnZ_&q=85&s=0dc873067d0a57ccce9f16e8ae7d4b7e" alt="" width="636" height="1024" data-path="zh/aitable/dashboards/dashboard-components/area-chart/images/image_lefQDeeCu0.png" />

## 管理面积图

鼠标浮动至已添加的面积图上，在右上方找到    图标，点击后可以选择执行以下操作：配置、重命名、复制、添加到仪表盘中心、复制为图片、导出为图片和删除。

<img src="https://mintcdn.com/dingtalk-8c0f98e2/YwlxKh9vB2sYUnZ_/zh/aitable/dashboards/dashboard-components/area-chart/images/image_OLD4DcaX2B.png?fit=max&auto=format&n=YwlxKh9vB2sYUnZ_&q=85&s=bb8ab991da22a963760cc49d2c293511" alt="" width="1112" height="702" data-path="zh/aitable/dashboards/dashboard-components/area-chart/images/image_OLD4DcaX2B.png" />

此外，可以拖拽面积图右下角来调整组件大小，或者拖拽组件上方区域来调整其位置。

![](https://img.alicdn.com/imgextra/i4/O1CN01E2Kgfz1T71YkiXOHT_!!6000000002334-1-tps-2798-1578.gif)
