# 页面组件：图表-数据表展示

来源快照：`result_data_new_260518.json`

- 来源 ID：`1965276721010596555`
- 模块：低代码平台e-builder
- 目录：专题学习 - 功能点专题 - 页面图表
- space ID：`1157961794811633670`
- 原文链接：未提供
- 产品基线：未提供

## 正文

******1.  场景说明******

通常当我们使用图表展示数据的时候，会想要更加直观的查看相关指标的数据，从而能够更好的结合图表理解数据。比如在合同管理中，除了能直观的看到图形，从而知道数据的变化趋势外，也能够看见数据表数据，更进一步掌握具体的数值变化。

效果如下图展示：

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157708323007103049&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

**************  
**************

**************2.  功能简介**************

上述场景可以使用统计图展示数据表功能实现。一般图表类的组件都可以启用数据表显示功能，数据展示通常分为横向扩展和纵向扩展。其中，饼状图的纵向扩展支持显示数据条样式。此外，数据表支持设置显示位置，是否显示合计至以及数据扩展宽度的设置等。

******  
******

******3\. 操作说明******         

1\. 页面设计器面板中拖入图表元素，如下柱状图和饼状图，分别设置右侧属性面板中的数据源，维度指标等基础图表信息。       


![](https://weapp.eteams.cn/papi/file/preview?fileId=1157708323063881815&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

  


2\. 开启数据表显示按钮，选择显示位置，扩展方向，确认是否开启合计按钮。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157708340254965774&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

  


(1) 如下是柱状图数据表显示：横向扩展设置，且开启合计值显示；

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157708340235362333&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)

  


(2) 如下是饼图数据表显示：纵向扩展设置，显示样式则为数据条，且开启合计值显示。

![](https://weapp.eteams.cn/papi/file/preview?fileId=1157708344588312586&type=redirect&customParam=%7B%22isExtDist%22%3Atrue%2C%22distributeId%22%3A%22%22%2C%22externalId%22%3A%22%22%2C%22appId%22%3A%22%22%7D)
