数据可视化（六）：如何优雅地选择数据图表（提升可视化效果经验总结）——学习笔记

1.学习目标

前面已经学习了可视化图表的选择方式，接下来主要探讨哪些方面的改进和有益实践，可以使我们的数据可视化的呈现效果更加具有表现力。主要是以下两个目标：

• 了解哪些方面的因素，会影响数据可视化的呈现效果；

• 熟悉数据层面/非数据层面提升可视化效果的实操经验，并能在工作中实际应用这些经验。

2.影响因素

总的来说，影响数据可视化效果的主要有以下两各个方面：

2.1数据层面：

• 数据分布不均匀，存在极端值。会导致比如柱形图中的某个柱形条过长；
• 某一维度下的属性值过多，信息繁杂不够聚焦。例如饼图的扇区数量过多；
• 不同层级的，数据量级差异较大。；
• 数据条目较多等。例如柱形图柱形条数量过多。

2.2非数据层面：

• 整个页面的布局；
• 图表的辅助元素，如图表背景、网格线、外边框、颜色等；
• 交互方式的设计等。

3.解决方案

3.1数据层面

3.1.1精简过多的数据项，突出重点

数据项过多会影响可视化结果的呈现，主要体现在两类图表：

      （1）展示比例型数据的图表

比例型分类数据的可视化方式有：饼图、圆环图、百分比堆叠柱状图、百分比堆叠面积图等，其目的是为了展示个体分类项和总体之间的比例关系。当根据某个属性进行分类时，类目最好保持在5-7个，当类目过多时，可合并属性值较小的类目，统一命名为“其他”。

（2）柱状图

当柱状图用来展示分类数据的情况时，若类目过多时建议保留头部和尾部，中间的可以以省略号带过或者折叠起来，放大时再展开。头部和尾部的具体数目，可以依据具体需要来定，比如前5名和后5名、前10名和后3名等。

3.1.2趋势图趋势不明显时，坐标轴数值可以不从0开始

当数据量比较大，而数据间的差异较小，导致折线的波动范围比较小，起伏趋势不明显，此时如果为了更清楚的看到数据的波动情况，坐标轴起始数值可以不从0开始，但是此时需要在页面提示用户，否则用户会误以为波动很大。

但是，柱状图的坐标轴起点，必须从0开始，否则柱形条的高度就不能代表数据间的差异。

3.1.3当数据的类别名称较长时，可以用条形图替换柱状图

柱状图横轴一般为类名，纵轴为数值，类名过长时虽然斜放可以避免重叠，但歪着头查看内容，和用户阅读的视觉习惯不符，此时可以考虑把柱条横向放置，把类别的名称置于柱条空隙之间或者柱形条左侧。

3.1.4坐标轴需要做对应的单位转化

在一个数据可视化平台内部，建立一套公共的单位转化规则，保证图表坐标轴单位转化规则的一致性，一般是以最大数值的单位作为整个坐标轴的统一单位。

3.2非数据层面

3.2.1页面整体布局

通过对可视化结果的重要性进行排序，合理布局页面，将用户的注意力集中在最重要的区域上。一般吸引用户注意力的方法为：将重要结果显示在中心位置；调整颜色突出显示。

3.2.1图表设计（辅助元素）

图表设计过程中要尽量弱化辅助元素，突出显示数据信息，包括：

• 去掉无意义的颜色填充；
• 弱化网格线；
• 去掉无用的背景色填充。

3.2.3交互设计

大多数图表中某个具体的点或者柱形条会代表一个数据信息，但是通常被隐藏了，我们可以通过一系列与用户的交互设计来获取数据的详细信息。常见的交互方式有：

（1）移动和缩放：

当前空间只能显示有限的数据时，或者需要关注局部数据时，可以使用移动和缩放。移动就是当目前的显示空间没有把数据展示全，需要把后一数据条露出一部分，指引用户可以进行移动操作；缩放的目的一般是为了在更大的空间去查看局部的细节数据，一般也需要移动图表来配合。比如柱形图可通过移动显示被隐藏的柱形条；

（2）悬停或点击：

在图表的某个位置悬停可以查看某个对象的详细信息，通常会以弹窗或者【图例+数据】的形式展现。点击的目的，通常是为了进行数据下钻，在这种情况下，需要通过设计传达给用户可以进行交互的信息，如鼠标悬停变手型、对象的颜色变化或者以文字指引等；

（3）图表联动

当多个图表的指标含有共同的维度属性时，我们聚焦于某个图表的某一维度下的属性值时，其他图表会联动变化。