跳到主要内容

「图表」小程序配置项详解

简介

「图表」小程序(下文简称 「图表」 )支持丰富的配置项,支持自定义你的图表样式。

名词解释

  • 数据源
    即需要生成可视化图表的维格表,每个「图表」都需要绑定一个维格表作为读取数据的源头。

  • 视图
    一个维格表内有多个视图,每个视图都公用同一份数据集(维格表),但是每个视图可以通过筛选、排序、分组等操作改变数据的显示,所以在「图表」件选择不同的视图,可以渲染不同的数据。

  • 图表类型
    「图表」中支持多种多样的图表类型,选择不同的图表类型可以适用于不同分享场景。

  • 维度
    分析数据的角度,对应到柱状图则为图形的 X 轴。

  • 数值
    对维度的量化,维度讲究的是从不同的角度出发去分析数据,而数值就是不同维度分析出来的结果。一般结果为数值。

  • 记录
    即维格表的表格视图下的每一行数据都叫记录。

  • 字段
    即维格表的表格视图下的每一列数据都叫字段。

  • 分组
    在现有的维度下对数据进行二次分类。比如设置 ”门店名称“ 作为维度,再以 ”商品大类“ 作为分组,就可以统计同一个店铺不同类型商品的数值。

  • 聚合统计
    在 “散点图” 的数值配置项以“统计指定字段” 时,必须开启了 “将散点值聚合统计” 后,才能对数值进行聚合统计。聚合统计包括求和、最大值、最小值、平均值。

配置介绍

选择视图

你可以为「图表」选择不同的视图,去过滤想要的数据。比如下图中《门店销售日报》有 ”全视图“ 和 ”南山店数据“ 两个视图,在「图表」中切换不同的视图,可以在图形上渲染不同的数据。

图表配置-配置视图

设置筛选

基于你上一步选择的视图数据,你还可以添加筛选条件对数据进行二次筛选。比如,筛选“时间”等于“本月”,则图形只显示本月的数据。

图表概览-设置筛选

图表类型

目前「图表」支持基础柱状图、堆叠柱状图、百分比堆叠柱状图、基础条形图、堆叠条形图、百分比堆叠条形图、饼状图、环状图、基础折线图、堆叠折线图、散点图等图形,切换图形类型方便你从不同角度分析问题。

配置项-配置图表类型

统计维度

统计维度,即数据的角度,对应到柱状图则为图形的 X 轴,但是对于条形图维度就是 Y 轴。除开附件字段以外,你可以选择任何字段作为维度。比如在《门店销售概览》中,分别以 ”门店名称“、”店长“、”销售时间“ 作为维度,将会看到不同的分类数据。

配置项-设置维度

  • 格式化日期

    当你选择的维度为 “日期” 类型的字段时,可以选择 “格式化日期”。 比如下图《门店销售概览》中以 “销售时间” 作为维度,可以格式化 “年-周”、“年-月”、“年-季度”、“年” 等展示形式。

    配置项-格式化日期

  • 分离多选值 当你选择的维度为 “多选” 类型的字段时,可以使用 “分离多选值” 控件将单元格内的多个选项拆分为单独的分类进行显示。“多选” 类型的字段包括:多选、成员、单向关联、双向关联等。

    比如下图《我的电影清单》中以 ”电影分类“ 作为维度,“钢铁侠” 这部电影属于 “剧情片, 动作片” 这个分类(在图形上这两个分类组合为了一个分类)。开启“分离多选值”后,这部电影将在图形上归为 “剧情片”,“动作片”这两个分类。

    配置项-分离多选值

    注意:开启“分类多选值” 后,图形上会将一条记录拆成多条记录。 比如上述场景 “钢铁侠” 这部电影原本属于 “剧情片, 动作片” 分类且记录数为 1,开启“分离多选值”后,这部电影将分别属于 “剧情片”,“动作片”这两个分类,且两个分类中记录数都为 1。如果使用饼状图显示这一条数据,原本“剧情片, 动作片” 占比 100% ,开启控件后 “剧情片”,“动作片” 这两个分类各占 50%。

统计数值

它是对维度的量化,维度讲究的是从不同的角度出发去分析数据,而数值就是不同维度分析出来的结果。

数值有两种统计方式:
方式一
统计记录总数:即统计对应维度下每个分类下有多少条数据。 比如,下图《门店销售概览》中以 ”门店名称“ 作为维度,数值为 ”统计记录总数“,第一个柱形表示 ”南山店“ 在表格内拥有 26 条销售记录。

配置项-统计记录总数

方式二
统计指定字段:将统计方式切换到 ”统计指定字段“,选择某一列字段进行汇总统计,还可以设置统计规则:求和、最大值、最小值、平均值;

只有 ”数值“ 类型的字段才能被设置为数值,”数值“ 类型的字段包括:数字、百分比、货币、评分、数值类型的公式或神奇引用;

比如,下图中《门店销售概览》中以 ”门店名称“ 作为维度,数值为 ”销售数量“ 和 ”求和“ ,第一个柱形表示 ”南山店“ 在这段时间内一共售卖了 174 件商品。

配置项-统计指定字段

按字段分组

即在现有的维度下对数据进行二次分类。除了附件字段以外,你可以选择任何字段作为分组条件。

比如下图是在 “基础柱状图” 上设置了 ”商品大类“ 作为分组依据, ”南山店“ 的总销售数量拆分为了 ”电脑办公“、”手机数码“、”家用电器“ 三类商品的销售数量。

如果我们将三类商品的销售数量相加,会发现正好等于基础图形中 ”南山店“ 的总销售量:35 + 82 +57 = 174

简而言之,分组功能可以将一个柱形拆分出多个柱形, 这样可以对同一个店铺内不同分类的商品销售数量进行对比,方便你做决策。

配置项-分组

堆叠

与分组类似,在现有的维度下对数据进行二次分类。但是与分组不同的在于,同一个组内的图形会层层堆叠起来。注意,只有堆叠类的图形才能设置堆叠字段。

堆叠又分为普通堆叠和百分比堆叠。一般堆叠和百分比堆叠。

一般堆叠

比如,下图以 ”门店名称“ 作为维度,”销售数量“ 作为数值,然后再设置以 “商品大类” 作为堆叠依据,就得到下方图形。实际上,它是将 “分组柱状图” 中 “南山店” 分类下的三个柱形,堆叠在了一起。

配置项-堆叠

百分比堆叠

与一般堆叠不同的在于它渲染图形的数值只有 [0 - 1],表示 0% - 100%。它以百分比的形式显示大分类下的细分类目占比情况。

比如,下图以 ”门店名称“ 作为维度,”销售数量“ 作为数值,然后再设置以 “商品大类” 作为百分比堆叠依据,就得到下方图形。

配置项-百分比堆叠

聚合散点值

它是一个特殊的配置项,当你选择 “散点图” 并将 “数值” 设置为 “统计指定字段”时,会出现 “将散点值聚合统计” 的配置项。

数值配置项以“统计指定字段” 时,必须开启了 “将散点值聚合统计” 后,才能对数值进行聚合统计。聚合统计包括求和、最大值、最小值、平均值。

配置项-聚合散点

更多配置

显示空值

打开 “显示空值” 配置项,在图形上会显示对应分类维度下 为 “空” 的分类。

比如,下图以 “门店名称” 作为分类,那么开启配置后,表格内没有选择店铺信息的数据会显示到 “空” 分类下。

配置项-空值

显示数值标签

打开 “显示数值标签” 配置项,在图形上会显示每个图形的数值大小。

配置项-数值标签

选择配色方案

配色分为两类主题:多色主题和单色渐变主题。

对于多色的图形(分组、堆叠等多分类)选择配色方案时,所选主题的会按色块顺序作色。

配置项-作色

对于单色图形(基础图形)选择配色方案时,所选多色主题会取第一个色块,单色渐变主题会取中间一个色块进行作色。

配置项-作色2

设置排序

选择以 X 轴或者 Y 轴进行排序,XY 轴对应的就是 “维度” 和 “数值”,如果以 “维度” 排序系统会按照文本规则进行排序,如果以 “数值” 规则进行排序系统会按照数值规则进行排序。

此外,还可以选择按正序排序或者按倒序排序,文本的正序倒序为 A→Z 和 Z→A ,数值的正序倒序为 1→9 和 9→1 。

配置项-排序

开启平滑曲线

只有在 “折线图” 中该配置才会出现,打开该配置后折线会变为曲线的样式。

配置项-平滑曲线