历史版本10 :日历图-全年 返回文档
编辑时间: 内容长度:图片数:目录数: 修改原因:

目录:

1. 概述编辑

1.1 应用场景

日历图(Calendar Heatmap),是指热力图和日历图两者组合的时序图,是一种双变量图,由时间变量和另一种变量组成。日历图可以反映出在一段日期内的数值分布情况,有利于分析人员在时间跨度上对某些数据进行对比分析。

可以应用在:

  • 显示本年每天的运动步数,用颜色深浅区分当天步数的多少。

  • 展示某城市的空气质量:显示该城市本年每天的 PM2.5 数据。

常见效果如下图所示:

23.png

1.2 基本要求

日历图的基本要求:

1)维度字段 >=1,且必须为完整日期格式。

2)日期数据必须连续,否则日历图无法按顺序排列。

1.3 图表特点

优点:有效结合了热力图和日历图,清晰呈现了随自然日历变化的指标大小。

缺点:只适合展现一到两个指标的变化。

2. 操作步骤编辑

2.1 添加组件

新建仪表板,点击「添加组件」,选择「火电数据」表。如下图所示:

12.png

2.2 生成图表

1)在图表类型下选择「自定义图表」,将「年月日」字段拖入横轴。如下图所示:

14.png

2)鼠标悬浮在横轴中的「年月日」字段上,点击右下角的倒三角,选择「更多分组>日」。如下图所示:

15.png

3)将「年月日」字段拖入到纵轴中,鼠标悬浮在纵轴中的「年月日」字段上,点击右下角的倒三角,选择「更多分组>月份」。如下图所示:

16.png

4)图形属性下,图表类型选择「矩形块」。如下图所示:

17.png

5)点击「组件样式>自适应显示」,选择「整体适应」。如下图所示:

18.png

2.3 美化组件

2.3.1 设置标签

将「年月日」字段拖入标签栏,鼠标悬浮到标签栏的「年月日」字段上,点击倒三角,选择「更多分组>日」。如下图所示:

19.png

2.3.2 设置颜色

将「FDL_DR」字段拖入到颜色栏,点击「颜色」栏,渐变方案选择「未来」。如下图所示:

20.png

2.3.3 取消图例

点击「组件样式>图例」,取消勾选「显示全部图例」。如下图所示

21.png

2.3.4 修改横纵轴字段名称

分别双击横纵轴上的字段,修改其名称为「日」、「月份」。如下图所示:

22.png

2.4 效果查看

2.4.1 PC 端

如下图所示:

23.png

2.4.2 移动端

App 及 HTML5 端效果如下图所示:

11.jpg

3. 纵轴拖入多个字段编辑

1)在本文示例基础上,将「年月日」字段拖入纵轴中,设置以年为分组。如下图所示:

24.png

2)数据可以按照年份进行分组。如下图所示:

25.png

4. 横轴拖入多个字段编辑

横轴拖入多个字段的效果如下图所示:

19.png

需注意:

若希望日历图中的日期按照「星期」有序排列,需要在「管理系统>系统管理>常规>周开始于」中选择「星期一」,重启工程。如下图所示:

21.png