跳到主要内容

图表组件

最近更新 2026/10/05

页面内用来构建和展示数据图表的组件为图表组件。

图表组件的添加过程,可见组件的添加方法。

配置图表​

图表组件的配置区域在页面画布区域的右侧。点击选中图表组件后,该组件对应的配置内容自动展开。

图表组件的配置内容包括数据配置和样式配置。

工作表选择​

开始进行数据配置时,需要先选定图表组件要用到的工作表。

支持使用状态为「可用」的工作表。

并可在后续编辑中,修改选定的工作表。工作表修改后,已完成的数据配置会被置空。

选定工作表后,配置区域可见该工作表内所有可用于图表配置的字段。

支持用于图表配置的字段类型为文本、数值、日期、时间和布尔类型,其他不可用类型不会展示到图表配置区。

数据配置​

图表组件的数据配置,包括:

  • 维度:数据的分类方式,决定了图表如何对数据进行拆分(如:按“日期”、“渠道”或“国家”查看)。
  • 指标: 需要观察的数据值,代表了您要观察的具体量化结果(如:点击量“求和”、留存率“均值”)。
  • 过滤:通过设置条件排除或筛选数据,仅保留特定部分。
  • 排序: 数据的排列规则,决定图表中各项的先后顺序。

其中,维度、指标和过滤,均支持批量选中字段并拖入。

图表渲染时,会按照数据配置的内容,基于工作表内的数据再次聚合计算。

配置维度(子维度)​

所有类型字段均可用来配置维度,您可以从右侧将字段拖入维度配置区域

选中单个维度字段,可对该维度进行操作:

  • 隐藏:仅一维表支持该配置,隐藏后维度字段会正常用于计算,但不会显示在表格内
  • 编辑字段:修改图表内的展示名字,对于工作表内的字段名称无影响
  • 移除:去掉该字段

配置指标​

所有类型字段均可用来配置指标,您可以从右侧将字段拖入指标配置区域

选中单个指标字段,可对该指标进行操作:

  • 聚合方式:支持求和、均值、计数、去重计数、最大值、最小值
  • 数字展示格式:支持取整、修改小数位数、修改百分比位数、自定义格式
  • 隐藏:仅一维表支持该配置,隐藏后指标字段会正常用于计算,但不会显示在表格内
  • 编辑字段:修改图表内的展示名字,对于工作表内的字段名称无影响
  • 移除:去掉该字段

除了针对单个字段进行聚合,您也可以添加自定义指标实现留存率、人均付费金额等公式类型计算,详见 自定义指标。如果已经配置了公共指标,也可直接使用。

配置过滤​

所有类型字段均可用来配置过滤。

过滤的结果,仅对当前配置的图表生效,使用同一个工作表的其他图表不受影响。

选中单个过滤字段,可对其进行操作:

  • 过滤设置:配置过滤规则,并可将过滤字段设置为「图内过滤器」;

    • 设置成「图内过滤器」后,会显示在图表上方,查看者也可以按照自己的需求调整过滤规则;
    • 默认的过滤规则,为编辑者在配置区域配置的过滤规则;
    • 未配置过滤规则时,字段的过滤不生效;
  • 编辑字段:修改图表内的展示名字,对于工作表内的字段名称无影响

  • 移除:去掉该字段

配置排序​

仅可选择已添加的维度和指标到排序中。

存在多个排序项时,会先按照排序项的顺序进行混合排序,再使用排序后的数据进行图表渲染和展示。

数值类型的排序项,可进行升序和降序。非数值类型的,可按字母顺序进行排序。

指标被添加到排序时,会按照指标的计算结果进行排序。

样式配置​

通过样式配置,来自定义图表的显示样式。根据图表类型的不同,可配置的样式内容有所不同。具体配置内容可在下方图表类型内查看。

图表类型​

一维表​

数据配置部分,需要至少配置一个指标,维度、过滤和排序为可配置项。

样式配置部分包含以下:

  • 图表标题:打开后,图表的标题将会显示在图表上方
  • 文字对齐:可设置表内的表头、维度和指标的对齐方式
  • 表格样式:可在三种表头和间隔行样式中选择
  • 单页显示行数:可选择单页显示行数,如果数据行数超过单页数量,则会出现翻页选项
  • NULL值显示:针对工作表内的NULL值可根据设置的情况显示结果
  • 外观设置:设置本组件的底色、边框颜色和边框粗细

透视表​

数据配置部分,需要至少配置一个指标,行维度、列维度、过滤和排序为可配置项。

样式配置部分包含以下:

  • 图表标题:打开后,图表的标题将会显示在图表上方
  • 文字对齐:可设置表内的表头、维度和指标的对齐方式
  • 表格样式:可在三种表头和间隔行样式中选择
  • 单页显示行数:可选择单页显示行数,如果数据行数超过单页数量,则会出现翻页选项
  • NULL值显示:针对工作表内的NULL值可根据设置的情况显示结果
  • 显示总计:可选择展示行总计、列总计
  • 外观设置:设置本组件的底色、边框颜色和边框粗细

折线图​

数据配置部分,需要至少配置一个指标,维度、子维度、过滤和排序为可配置项。

样式配置部分包含以下:

  • 图表标题:打开后,图表的标题将会显示在图表上方
  • 指标设置:存在多个指标时,可按指标设置折线的平滑、线性、线宽
  • 坐标轴:设置坐标轴的显示与否,标签间隔,X轴可设置标签的显示角度,Y轴可设置最大最小值
  • 显示条数:配置折线图渲染时X轴的维度数上限,以及决定线条个数的子维度数上限
  • 缺失数据:设置维度存在,对应指标计算无时,折线图如何渲染
  • 外观设置:设置本组件的底色、边框颜色和边框粗细

指标卡​

数据配置部分,需要至少配置一个指标,维度和过滤为可配置项。

配置有多个指标时,指标会并列展示;配置了维度的情况下,会按照维度值展示不同维度对应的指标值。

样式配置部分包含以下:

  • 图表标题:打开后,图表的标题将会显示在图表上方
  • 对齐方式:设置的对齐方式影响到所有的维度值、指标值和指标名
  • 显示:当指标卡配置有维度时,可配置单行最多展示的维度数,超过会换行展示
  • 指标样式:展示指标名,可配置指标名称和指标值的字体颜色和大小
  • 维度样式:配置有维度时,可配置维度名称的字体颜色和大小,以及最多展示的维度总个数
  • NULL值显示:针对工作表内的NULL值可根据设置的情况显示结果
  • 外观设置:设置本组件的底色、边框颜色和边框粗细

进度图​

进度条、圆形进度条、水波图和仪表图。

数据配置部分,需要至少配置一个指标,一个目标值。过滤为可配置项。

样式配置部分包含以下:

  • 图表标题:打开后,图表的标题将会显示在图表上方
  • 当前值目标值:调整当前值和目标值文本的颜色、字号和位置。
  • 指标样式:调整指标名称和占比文本的颜色、字号和小数位数。
  • 进度条/水波图/仪表图样式:调整组件的模式、透明度和外环粗细。
  • 颜色设置:调整组件的颜色。
  • 外观设置:设置本组件的底色、边框颜色和边框粗细

柱状图​

堆积柱状图、百分比堆积柱状图的设置同柱状图。

数据配置部分,需要至少配置一个指标,维度、子维度、过滤和排序为可配置项。

样式配置部分包含以下:

  • 图表标题:打开后,图表的标题将会显示在图表上方
  • 柱状样式:设置柱框和柱图圆角
  • 图表切换:可在水平和垂直柱图之间切换,以及在堆积柱图、百分比堆积柱图之间切换
  • 坐标轴:设置坐标轴的显示与否,标签间隔,X轴可设置标签的显示角度,Y轴可设置最大最小值
  • 显示条数:配置柱状图渲染时X轴的维度数上限,以及子维度数上限
  • 外观设置:设置本组件的底色、边框颜色和边框粗细

饼图​

数据配置部分,必须配置维度(作为扇区分类)和指标(作为扇区占比),分组、颜色、尺寸、过滤为可配置项,不支持设置排序(饼图没有排序逻辑)

样式配置部分包含以下:

  • 图表标题:打开后,图表的标题将会显示在图表上方

  • 绘图区域:可以指定维度值的颜色,并设置填充透明度(默认85%)

  • 坐标轴

    • 扇区数:影响饼图上展示的扇区数量,超过的维度值的数据将聚合为“其他”
    • 扇区半径:影响饼图大小
    • 内径:影响中间空白部分大小(即变成环形),默认0
    • 内描边:为扇区增加描边
  • 标签

    • 显示标签:默认显示,可不开启
    • 开启后,可额外配置维度、指标、百分比是否展示
  • 图例

    • 显示图例:默认显示,可不开启
    • 位置:居上、居下(默认)、居左、居右
    • 对齐方式:左(默认)、中、右
  • NULL值显示:针对工作表内的NULL值可根据设置的情况显示结果

  • 外观设置:设置本组件的底色、边框颜色和边框粗细

散点/气泡图​

数据配置部分,必须配置X轴、Y轴指标以及分组;尺寸、过滤为可配置项,不支持设置排序。

样式配置部分包含以下:

  • 图表标题:打开后,图表的标题将会显示在图表上方

  • 绘图区域:可以指定维度值的颜色,并设置填充透明度(默认85%)

  • 坐标轴:设置坐标轴的显示与否,标签间隔,X轴可设置标签的显示角度,Y轴可设置最大最小值

  • 网格线:控制图上是否展示网格线

  • 图例

    • 显示图例:默认显示,可不开启
    • 位置:居上、居下(默认)、居左、居右
    • 对齐方式:左(默认)、中、右
  • NULL值显示:针对工作表内的NULL值可根据设置的情况显示结果

  • 外观设置:设置本组件的底色、边框颜色和边框粗细

双轴组合图​

数据配置部分,必须配置一个主轴指标或次轴指标,维度、子维度、过滤和排序为可配置项。

双轴组合图特有的样式配置部分包含以下:

  • 图表切换:可为主轴和次轴分别设置图表类型,支持柱状图、堆积柱状图、百分比堆积图或折线图
  • 折线样式:同折线图配置一致
  • 柱状样式:同柱状图配置一致
这篇文档对你有帮助吗?