日历图

1.1 应用场景

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

可以应用在：

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

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

常见效果如下图所示：

1.2 基本要求

日历图的基本要求：

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

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

1.3 图表特点

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

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

2.1 添加组件

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

2.2 生成图表

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

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

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

4）图形属性下，图表类型选择「矩形块」。如下图所示：

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

2.3 美化组件

2.3.1 设置标签

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

2.3.2 设置颜色

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

2.3.3 取消图例

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

2.3.4 修改横纵轴字段名称

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

2.4 效果查看

2.4.1 PC 端

如下图所示：

2.4.2 移动端

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

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

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

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

需注意：

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