历史版本20 :动态显示标题 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 应用场景

默认情况下,组件标题是静态的,为了增强图表的可读性,通过设置动态标题,让标题随着数据变化而变化,这样可快速展示关键信息、提升沟通效率。动态标题变化由是否添加指标分为两种场景。如下表所示:

是否需要在动态标题添加指标
实现方式区别不同实现方式的优点
不需要可直接编辑组件标题实现效果实现方式更便捷,不需要在标题中添加指标的情况下可优先选择这种方法实现效果。
需要需要先隐藏组件标题,再使用文本组件代替标题。可在标题中添加仪表板内过滤组件值和组件内字段。(包括指标字段和维度字段)

1.1.1 场景一:不添加指标的动态标题

介绍在不需要在标题中添加指标情况下,能够实现动态标题的方法。例如,点击词云组件的「福建福欣热轧」且年月区间过滤组件选择「2017 年 1 月- 2017 年 5 月」则折线图标题自动跟随变化,显示「福建福欣热轧 2017-01 到 2017-05 合同金额趋势」。效果如下所示:

2020-08-26_15-50-19.gif

1.1.2 场景二:添加指标的动态标题

用户想实现在组件标题中添加指标时,如何实现动态标题。如下图所示:

2020-08-28_11-35-26.gif

1.2 解决思路

1.2.1 场景一:不添加指标的动态标题

组件制作完成后,编辑目标组件标题,在标题中添加仪表板内的维度字段和过滤组件值等建立联动联系。点击仪表板界面产生联动后或者在添加过滤条件后,标题随之发生变化,实现动态标题效果。

1.2.2 场景二:添加指标的动态标题

组件制作完成后,先将目标组件标题隐藏后,使用文本组件代替标题,在标题中添加仪表板内指标等任一字段或控件,点击相关字段或者输入控件值,标题跟随变化产生联动效果。

2. 场景一:不添加指标的动态标题编辑

2.1 制作仪表板

在设置动态标题之前需要制作好仪表板。

2.1.1 新建仪表板

打开「仪表板>新建仪表板」,输入仪表板名称位置,命名为「动态标题仪表板」,点击「确定」完成创建。如下图所示:

2.1.2 添加折线图组件

1)点击「添加组件」,如下图所示:

2)选择「 KPI 指标项」数据集添加组件。如下图所示:

3)将待分析区域下的「合同签约时间」和「合同金额字段」拖入右侧横纵轴,图表类型选择「分区折线图」,完成折线图制作。如下图所示:

2.1.3 添加词云组件

1)点击「 + 」添加组件,如下图所示:

2)同样选择「 KPI 指标项」数据集添加组件,如下图所示:

2020-08-26_15-25-56.png

3)将待分析区域「产品名称」和「记录数」添加到维度指标栏,图表类型选择「词云」。如下图所示:

2020-08-26_15-27-30.png

4)完成词云组件制作后,点击「进入仪表板」界面,如下图所示:

2020-08-26_15-29-00.png

2.1.4 添加时间过滤组件

添加时间过滤组件中的年月区间过滤组件,过滤仪表板的折线图组件。

1)点击「过滤组件>年月区间」添加年月区间过滤组件。如下图所示:

2020-08-26_15-30-18.png

2)过滤组件绑定「 KPI 指标卡」下的「合同签约时间」字段,点击「确定」完成过滤组件制作。如下图所示:

2.2 设置动态标题

制作完仪表板后,接下来以设置折线图的动态标题为例,阐述不添加指标情况下,动态标题解决方案。

选中折线图组件,点击「 v >编辑标题」进行动态标题设置。如下图所示:

2.2.1 添加字段

在标题中添加字段。点击「自定义>image.png>产品名称」,在标题内容处则成功添加「产品名称」字段,如下图所示:

2.2.2 添加过滤组件值

点击「image.png>年月区间」添加「年月区间」过滤组件值,如下图所示:

2020-08-26_15-39-29.png

2.2.3 添加文本内容

在「产品名称」字段和「年月区间」过滤组件值后输入自定义文本内容。如下图所示:

2020-08-26_15-51-03.png

2.2.4 编辑标题样式

选中标题内容,编辑标题样式。设置字体字号「 16 」,「加粗」,字体颜色设置「红色」,标题位置「居中」,点击「确定」完成标题设置。如下图所示:

2020-08-26_15-47-48.png

2.5 效果查看

实现效果可参考本文 1.1.1 节。

仪表板详情可查看:动态标题仪表板

3. 场景二:添加指标的动态标题编辑

3.1 制作组件

先制作好组件之后,才可进行组件标题的制作。

3.1.1 创建组件

打开「数据准备>行业数据>教育行业」下的「各学院招生人数表」,「创建组件」,填写组件所在仪表板信息点击「确定」完成操作。如下图所示:

2020-08-27_17-13-01.png

3.1.2 添加计算指标

计算实际招生完成的比例。

1)点击搜索字段旁边的「 + 」添加计算指标。如下图所示:

2020-08-27_17-28-03.png

2)添加「招生完成比例」指标。输入公式SUM(实际招生)/SUM(计划招生)求得「招生完成比例」指标,输入计算指标字段名称,点击「确定」完成操作。如下图所示:

公式说明:

  • SUM(实际招生)/SUM(计划招生):本例代表按照「学院」维度先对「实际招生」和「计划招生」进行分组求和,计算得出「实际招生」占「计划招生」的比例。

  • SUM_AGG() :根据当前分析维度,动态返回指标字段的汇总求和值,生成结果为一动态数据列,行数与当前分析维度行数一致。

注:聚合函数 SUM_AGG() 公式内容需选择左侧字段才能生效。本例添加「计划招生」和「实际招生」字段。

2020-08-28_10-05-22.png

3.1.3 添加分组表

添加分组表。选择「分组表」,将待分析区域字段拖入右侧对应的维度指标栏中,完成分组表制作。拖入的对应字段如下图所示:

2020-09-03_11-21-37.png

3.1.4 设置数值格式

将「招生完成比例」设置为百分比形式。

1)点击「招生完成比例(聚合)> v >数值格式」,设置该字段数值展示形式。如下图所示:

2020-08-28_10-22-13.png

2)将数值字段「招生完成比例」设置为「百分比」形式,小数位数「 2 」,点击「确定」,完成设置。如下图所示:

2020-08-28_10-23-14.png

3)查看「招生完成比例」字段以变成百分比形式,点击「进入仪表板」,完成分组表组件制作。如下图所示:

2020-08-28_10-24-15.png3.1.5 隐藏标题

由于组件标题无法添加指标,需先隐藏标题,添加文本组件代替标题位置。

选中组件,点击「 v 」后,取消勾选「显示标题」即可隐藏标题。如下图所示:

2020-08-28_10-46-07.png

3.2 制作文本组件

将标题想展示的内容和艺术效果在文本组件内编辑。

3.2.1 添加文本组件

点击「其他>文本组件」添加文本组件。如下图所示:

2020-08-28_10-50-23.png

3.2.2 添加字段

点击文本组件,添加内容。点击「image.png」,依次添加文本字段「学院」和计算指标字段「招生完成比例(聚合)」,添加成功后在文本组件中显示。如下图所示:

2020-08-28_10-56-24.png

3.2.3 添加文本内容

光标选中两字段中间,输入文本。如下图所示:

2020-08-28_11-08-52.png

3.2.4 设置文本样式

选中文本内容,编辑文本组件样式。字体字号「 20 」,「加粗」,背景颜色「黄色」,调整位置和大小。最后效果如下图所示:

2020-08-28_11-29-35.png

3.3 设置默认值

用户如果需要在查看仪表板时,标题默认显示成「历史学院」。则需要在编辑状态下点击「历史学院」完成联动,如下图所示:

23.png

然后再点击仪表板预览,预览状态下的默认值即变成「历史学院计划招生认数完成目标的69.38%」。

3.5 效果查看

在标题中引用指标效果可参见本文 1.1.2 节。

仪表板详情可参见:组件标题添加指标