上一篇文章我们聊了图表设计，包括基本信息、设计原则、应用场景、实现流程、构成几方面的内容。今天，我们再来聊聊常见的图表类型。
文章末尾会附上一些常用的具有针对性的图表组件源文件可下载，方便大家设计的时候图表复用～折线图一般通过线条的波动（上升或下降）来显示连续数据随时间或有序类别变化的图表，常用于反映数据随着时间推移而产生的变化趋势、增速减率，是基于时间的图表类型。使用建议：
1、如折线条数过多时不建议将多条数据绘制在一个图表中，这样很难看出不同类别的情况。2、使用合适的时间间隔，使锯齿状的线条平滑。如折线上下浮动太大，可以试试拉长时间间隔。3、善用点标记、特殊标记以及悬停方式展示数据，不适宜全部都把折线上的数据点标注出来。4、对比数据较多的时候，可采用对比方式，分清主次，加强重要突出信息的感知。曲线图是折线图中的一种，当图表数据波动较大时，使用曲线图更能表达数据随时间变化的整体趋势或周期性。比如采用折线图，会让图表整体比较混乱，不利于信息展示。折线图与曲线图的区别：
折线图：更关注于点的数据，相对短的一段时间数据随时间变化的趋势；曲线图：更关注点构成的线点数据，一段时间内整体数据随时间变化的趋势。面积图原理与折线图相似，是一种随有序变量的变化，反映数值变化的统计图表。面积图是在折线图的基础之上形成的，它在折线图的基础上多了一个面积概念，填充的区域可以表示“累积”的含义（当X轴为连续的数值时）。在设计的时候，面积部分的颜色要带有一定的透明度，透明度可以很好的帮助使用者观察不同序列之间的重叠关系，没有透明度的面积会导致不同序列之间相互遮盖减少可以被观察到的信息。当数据值相距很远时，区域是模糊不清的，此时不太适合使用面积图展示。面积图只适合展现少量的数据，如果数据类别超过4个，会导致面积堆积在一起非常难以识别，建议要尽量避免使用面积图，采用相似图表来表示，比如折线图。堆积面积图
堆积面积图是面积图里的一种分类，与面积图唯一的区别是堆叠面积图有多个数据系列，它们一层层的堆叠起来，每个数据系列的起始点是上一个数据系列的结束点。适应用于观察多变量随时间的变化情况，且既能看到整体趋势又能看到各变量的构成情况。1、堆积面积图不要超过7个数据系列，当数据系列过多时，往往造成难以观察。2、建议堆叠面积图中把变化量较大的数据放在上方，变化量较小的数据放在下方会获得更加的展示效果。3、堆积面积图要展示部分和整体之间的关系，所以不能用于包含负值的数据的展示。
柱状图，是一种使用矩形条，对不同类别进行数值分类比较、趋势统计图表，尤其是当数值比较接近时。使用垂直或水平的柱子的长短对比数值大小，其中一个轴表示需要对比的分类维度；另一个轴代表相应的数值。通常来说，柱形图的横轴更多会展现时间维度，用户会习惯性的认为存在时间趋势。如果遇到横轴为时间维度以外的变量，建议用颜色区分每根柱子。使用建议：
当柱子太窄时，用户的视觉可能会集中在两个柱中间的负空间，而这里是不承载任何数据的。宽度推荐使用在1/2 柱宽到 1 柱宽之间。保证柱形图有精确的圆角，以确保柱形顶部精确测量柱形的长度；全圆角则有可能歪曲可视化图表的表达。柱形图一般比较一组分类数据，柱子的高低已经传递了相关信息，不必通过颜色来区分，建议使用相同的颜色或同一颜色的不同色调，过多的颜色会增加理解成本。如果需要强调某个数据时，可以使用对比色或者变化色调来突出显示有意义的数据点。对多个数据系列排序时，如果不涉及到日期等特定数据，最好能符合一定的逻辑用直观的方式引导用户更好的查看数据，比如条形图来进行展示。可以通过升序或降序排布或者其他有逻辑排序方式，可以一定程度上引导人们更好地阅读数据。条形图还可以通过省略横轴和纵轴，并直接在柱子上表明数值，来降低数据墨水比，进一步提高信息的获取效率
分组柱状图
跟柱状图类似，使用柱子的长短来映射和对比数据值。使用不同的颜色或者相同颜色不同透明的方式区别各个分类，各个分组之间需要保持间隔。1、分组个数不要超过 12 个，每个分组下的分类不要超过 6 个。2、分组柱状图适合比较多组数值差异不大的数据，数据的数值差异大，建议使用双轴图。分组柱状图强调组的概念，组是一个个重复单元。按照格式塔原理，每两个分组之间的间距要大于组内不同系列之间的间距，以免造成视觉上错误的归类和区分。堆叠柱形图
堆叠柱形图属于柱形图的一种，普通的柱形图数据值为并行排列，堆叠柱图则是一个个叠加起来的，用于展示数据的趋势、对比、占比，并且这些子类别一般用不同的颜色区分。
使用建议
1、纵向堆叠柱状图 – 最多不要超过6个数据。
2、堆叠柱状图不适宜展示包含负数的数据。
3、数据标签特别长时，采用水平堆叠柱状图。
双向柱状图
双向柱状图是使用正向和反向的柱子显示类别之间的数值比较，其中分类轴表示需要对比的分类维度，连续轴代表相应的数值，分为两种情况，一种是正向刻度值与反向刻度值完全对称；另一种是正向刻度值与反向刻度值反向对称，即互为相反数。可分为垂直方和水平两个方向，其中水平双向柱状图又叫正负条形图。1、不适合不含相反含义的数据：比如收入和支出就适合，男女就不适合使用2、采用色彩差异较大的颜色，保证高效的获取有效的信息。
饼图是把一个圆形一个划分为几个扇形的，用来描述某一部分占整体的百分比的统计图表。每个扇形的弧长（以及圆心角和面积）大小，表示该种类占总体的比例。使用建议
1、分块数量尽量控制在5个以内，最多不要超过9个。分类的增多，每个切片的面积变小，视觉区分度随之降低。
当数据类别较多时，我们可以把较小或不重要的数据合并成第五个模块命名为”其它”。
如果一定要保证数据的完整性和准确性，此时选择柱状图或堆积柱状图或许更合适。
2、切片大小相似时，建议采用柱状图或南丁格尔玫瑰图。
人类对“角度”的感知力并不如“长度”，在需要准确的表达数值（尤其是当数值接近、或数值很多）时，饼图常常不能胜任。
3、正确放置切片位置，提高图表可读性。
大多数人视觉习惯是按照顺时针和自上而下的顺序去观察。因此在绘制饼图时，建议从12点钟开始沿顺时针右边第一个分块绘制饼图最大的数据分块，有效的强调其重要性。顺时针放置第二大份额的，以此类推，
环形图与饼图用法相似，适用于展示分类的占比情况，是由两个及两个以上大小不一的饼图叠在一起，挖去中间的部分所构成的图形。环图相对于饼图空间的利用率更高，比如我们可以使用它的空心区域显示文本信息，比如标题、总数据等。
南丁格尔玫瑰图是在极坐标下绘制的柱状图，外形很像饼图，但它是用半径来反映数值大小的（而饼图是以扇形的弧度来表示数据的）。适宜用到对比不同分类的大小，且各分类值差异不是太大时。视觉上，南丁格尔玫瑰图会将数据的比例夸大。
雷达图是将多个分类的数据量映射到坐标轴上，可对比项目内不同属性的情况的图形。对于查看哪些变量具有相似的值、变量之间是否有异常值都很有用。
雷达图表也可用于查看哪些变量在数据集内得分较高或较低，因此非常适合显示能力同样，雷达图也常用于排名、评估、评论等数据的展示。每个变量都有一个从中心向外发射的轴线，所有的轴之间的夹角相等，同时每个轴有相同的刻度，将轴到轴的刻度用网格线链接作为辅助元素，连接每个变量在其各自的轴线的数据点成一条多边形。使用建议
如果变量过多，也会造成可读性下降，因为一个变量对应一个坐标轴，这样会使坐标轴过于密集，使图表给人感觉很复杂，所以最佳实践就是尽可能控制变量的数量使雷达图保持简单清晰。一个雷达图包含的多边形数量是有限的，如果有五个以上要评估的事物，无论是轮廓还是填充区域，都会产生覆盖和混乱，使得数据难以阅读。
散点图用于研究两个变量之间关联、分布关系的经典图表。它适用于分析变量之间是否存在某种关系或相关性。其中，相关性包含正相关（两个变量值同时增加）、负相关（一个变量值增加另一个变量值下降）、不相关、线性相关、指数相关、U形相关等。使用建议
1、如果数据量过少时，数据比较分散且混乱，看不出分布逻辑，不推荐使用散点图的。2、尽量为散点图添加趋势线，需要注意的是最多2条趋势线。3、用颜色、形状来区分不同的数据类别，但是要避免数据分类过多的情况。
气泡图是散点图的变形，显示变量之间关联、分布、大小相关性的一种图表，由笛卡尔坐标系（直角坐标系）和大小不一的圆组成。
与散点图不同的是，气泡图是一个多变量图，它增加了第三个数值即气泡大小的变量，用气泡大小代替散点图中的数值点，面积大小代表数值大小。可以通过气泡的位置分布和大小比例，来分析数据的规律。当然，气泡图也可以容纳更多维的数据，例如用第4个变量决定气泡的颜色、透明度等。使用建议
气泡的大小应体现为面积，而非半径，绘制气泡图时，需注意气泡的大小是映射到面积而不是半径或者直径绘制的。
漏斗图是展现业务步骤流程比较规范、周期长、环节多的单流程单向分析的图表，从上到下有逻辑上的顺序关系，适用于有固定流程并且环节较多的分析。数据是要有序的，彼此之间有逻辑上的顺序关系，阶段最好大于3个。
与饼图一样，漏斗图呈现的也不是具体的数据，而是该数据相对于总数的占比、漏斗图不需要使用任何数据轴。通过各环节业务数据能够说明问题所在进而做出决策，能直观显示流转情况。漏斗图还可扩展为“对称漏斗图”，同时对两个业务流程进行分析，对比两者的数据情况。使用建议
1、数据要逻辑上的顺序关系
2、梯形的高度、面积都是有意义的，不应随意篡改。
热力矩阵图，是通过颜色变化来显示数据，适合交叉检查多变量数据，整体观察数据之间的差异性和相关性的图表。
矩形树图将层次结构（树状结构）的数据显示为一组嵌套矩形。树的每个分支都有一个矩形，然后用代表子分支的较小矩形平铺。叶子节点的矩形面积与数据占比成比例。通常，叶节点会用不同的颜色来显示数据的关联维度。
箱线图又称“盒须图”，支持展现数据的上极限、上四分位数、中位数、下四分位数、下极限，垂直或水平的方式展示均可，从箱体两端延伸出来的线条称为“晶须”，用来表示上、下四分位数以外的变量。异常值有时会与晶须处于同一水平的单一数据点表示。箱形图通常用于描述性统计。
烛台图又称“日本K线图”，通常用来显示和分析证券、衍生工具、外汇货币、股票、债券等商品随着时间的价格变动。蜡烛图通过使用烛台式的符号来显示多种价格信息，如：开盘价、收盘价、最高价和最低价，每个代表单一时间段（每分钟、每小时、每天或每月）的交易活动。每个烛台符号沿着 X 轴上的时间刻度绘制，显示随着时间推移的交易活动。
以上主要是选用了一些工作中使用频率多的类型讲解，其中：包含商务仪表盘、地理坐标图等等使用频率少了就没有讲到，如果您想了解，可以在后台留言，小编可以考虑再做一期哟。
推荐两个可采用代码的可视化图表链接，我相信开发同学应该会很开心，大大提升开发效率。
Apache ECharts：
https://echarts.apache.org/examples/zh/index.html
Make A pie：
https://www.makeapie.com/explore.html
我们对于数据可视化图表的理解与认识还是基础的，实际应用的时候还需要做到实用性与可用性的之间找到平衡点，切勿把可视化作为设计艺术创作的简单过程那就本末倒置了。在此认识理解的基础之上在一些复杂的数据结合的时候，还可以尝试大胆多视图协调关联设计，甚至可以在条件允许的情况下与产品、研发共同工作做出新的图表视图。彩蛋福利：赠送大家“可视化图表组件库源文件”感兴趣的小伙伴可以都拿去！领取方式如下：1.关注“789研习社”。2、在后台回复 “ 图表” 就可以领取在这快节奏的浮躁的时代中，我们需要保持设计的初心，做有灵魂的设计，我们下篇再见~参考文献：《数据可视化》-陈为、沈则潜、陶煜波等编著 电子工业出版社 ；《大数据时代》维克托·迈尔·舍恩伯格，图片部分来源于网络，侵权即删。