参考

AntV官网 https://antv.vision/zh
AntV官网设计原则 https://antv.vision/zh/docs/specification/principles/basic
图标用法 https://antv-2018.alipay.com/zh-cn/vis/chart/index.html
墨者学院-设计原则 https://www.yuque.com/mo-college/vis-design

图表的作用:帮助我们用户更好地看懂数据。
选择什么图表,需要回答的首要问题是『我有什么数据,需要用图表做什么』,而不是『图表长成什么样』。

按照图形等维度对图表进行分类(柱状图、饼图、趋势图),会导致图表的误用。我们更应该从数据出发,从功能角度对图表进行分类,如下:
比较类,分布类,流程类,占比类,区间类,关联类,趋势类,时间类,地图类。
image.png

比较类 分布类 流程类 地图类 占比类 区间类 关联类 时间类 趋势类

比较类compare

可视化的方法显示值与值之间的不同和相似之处。使用图形的长度、宽度、位置、面积、角度和颜色来比较数值的大小,通常用于展示不同分类间的数值对比,不同时间点的数据对比。

分布类distribute

可视化的方法显示频率,数据分散在一个区间或分组。使用图形的位置、大小、颜色的渐变程度来表现数据的分布,通常用于展示连续数据上数值的分布情况。

流程类flow

可视化的方法显示流程流转和流程流量。一般流程都会呈现出多个环节,每个环节之间会有相应的流量关系,这类图形可以很好的表示这些关系。


占比类proportion

可视化的方法显示同一维度上占比关系。

区间类range

可视化的方法显示同一维度上值的上限和下限之间的差异。 使用图形的大小和位置表示数值的上限和下限,通常用于表示数据在某一个分类(时间点)上的最大值和最小值。

关联/关系类relation

可视化的方法显示数据之间相互关系。使用图形的嵌套和位置表示数据之间的关系,通常用于表示数据之间的前后顺序、父子关系以及相关性。

趋势类trend

可视化的方法分析数据的变化趋势。使用图形的位置表现出数据在连续区域上的分布,通常展示数据在连续区域上的大小变化的规律。

时间类time

可视化的方法显示以时间为特定维度的数据。使用图形的位置表现出数据在时间上的分布,通常用于表现数据在时间维度上的趋势和变化。

面积图
K线图
卡吉图
折线图
螺旋图
堆叠面积图

地图类location

可视化的方法显示地理区域上的数据。使用地图作为背景,通过图形的位置来表现数据的地理位置,通常来展示数据在不同地理区域上的分布情况。

带气泡的地图
分级统计地图
点描法地图