系统运维、技术分享、架构、方案

it运维技术文章分享

《七天数据可视化之旅》第五天:常用图表对比

《七天数据可视化之旅》第五天:常用图表对比

Destiny,某物流公司数据产品经理,目前从事数据平台搭建和可视化相关的工作。持续学习中,期望与大家多多交流数据相关的技术和实际应用,共同成长。

0x00 前言

在之前分享的【数据图表的选择】三篇文章中,已经把不同类型数据图表的用法和适用场景做了一遍梳理。但是,在实际的业务场景中,如何根据拥有的数据集、想要展现的数据模式,去选择最合适的图表,需要不断的去实践和总结。

因此,今天这篇文章分享的内容,是来对比常见相似图表的差别和适用的数据集。

本篇将通过一些来源于实际业务场景的数据集实例,来进行不同的可视化方案对比,从而总结出根据可视化目的、数据集特征,去选择图表类型的一般套路。图表对比部分,会选择一些常见的,且比较容易混淆的图表类型来做对比,以「可视化目标→数据集准备→图表选择和对比→经验总结」的方式来行文。

0x01 常用图表对比

1.柱状图 VS 条形图

1)可视化目标

展示2019年上半年`销售额Top10的手机品牌`、`销售额Top10的手机型号`。

2)数据集准备

手机品牌 销售额(元)
Apple 1,900,000,000
…… ……
魅族 400,000,000
手机型号 销售额(元)
Ipnone X 64G 黑色 120,600,000
…… ……
魅族 16th Plus 8GB+128GB 远山白 46,500,000

3)图形对比

《《七天数据可视化之旅》第五天:常用图表对比》

4)总结

  • 相同点:
    • 柱状图和条形图的数据结构是相同的,都是由「一个分类字段+一个连续数值字段」构成。
    • 当数据的记录数不大于12条,分类字段的字符长度小于5时,此时柱状图和条形图可以互换。
  • 不同点:
    • 柱状图:若分类字段,恰好是「时间序列」,此时建议使用柱状图,因为柱状图能更好地体现数据随时间的变化情况。
    • 条形图:若分类字段的字符长度较长,且数据的记录数大于12,此时建议使用条形图。

      一方面,斜置的文字和用户阅读的习惯相悖,同时也占用页面空间,影响可视化图表的美感。

2.柱状图 VS 直方图

1)可视化目标

  • 展示某家出售小商品的店铺,不同品类的商品销售数量。
  • 已知某家出售小商品的店铺,其商品定价范围在[0,100)之间,现需展示该店铺在售商品的价格分布,要求每10元作为一个区间。

2)数据集准备

数据集1:

价格区间 订单数
[0,10) 10
[10,50) 27
[50,100) 43
[100,+∞) 6

数据集2:

价格区间 在售商品数量
[0,10) 13
[10,20) 16
[20,30) 16
[30,40) 25
[40,50) 11
[50,60) 14
[60,70) 9
[70,80) 7
[80,90) 6
[90,100) 3

3)图形对比

《《七天数据可视化之旅》第五天:常用图表对比》

4)总结

  • 相同点:
    • 柱状图和直方图的数据结构是相同的,都是由「一个分类/分组字段+一个连续数值字段」构成。
    • 都是由柱形条构成。
  • 不同点:
    • 分析目的和适用场景不同。「柱状图」主要是比较数据的大小,「直方图」是用来展示数据的分布。
    • 映射到X轴上的数据属性不同。在柱状图中,X轴上的变量是分类数据,例如不同的手机品牌、店铺或网站在售商品的分类。

      在直方图中,X轴上是连续的分组区间,这些区间通常表现为数字,且一般情况下组距是相同的,例如将在售商品的价格区间分为的“0-10元,10-20元……”。

    • 宽度代表的意义不同。在柱状图中,柱子的宽度没有实际的含义,一般为了美观和整齐,会要求宽度相同;

      在直方图中,柱子的宽度代表了区间的长度(即组距),根据区间的不同,柱子的宽度可以不同,但其宽度原则上应该为组距的整倍。

    • 表示数据大小的方式不同。柱状图,是通过柱形条的高度,来映射数据的大小,且柱子之间有间隔;

      直方图,是通过面积来表示数据的大小,且柱子之间紧密相连,没有间隔。

3.堆叠柱状图 VS 百分比堆叠柱状图

1)可视化目标

  • 展示某影院2019年上半年总票房趋势及华语片、外语片趋势。
  • 展示某影院2019年上半年总票房收入构成占比趋势。

2)数据集准备

数据集1:票房收入(元)

月份 国产片 外语片
1月 800,000,000 900,000,000
…… ……
6月 1,700,000,000 800,000,000

数据集1:票房收入占比

月份 国产片 外语片
1月 49% 51%
…… ……
6月 70% 30%

3)图形对比

《《七天数据可视化之旅》第五天:常用图表对比》

4)总结

  • 相同点:
    • 堆叠柱状图和百分比堆叠柱状图,都适合用来展示分类数据的构成对比或构成随时间的变化趋势。
    • 当映射到X轴上的数据为时间序列时,此时可以用堆叠面积图or百分比堆叠面积图来代替。
  • 不同点:
    • 堆叠柱状图:既可以对比各构成部分的数值差异,还可以观测各组数据的整体差距。
    • 百分比堆叠柱状图:只能对比整体中的各构成部分的占比差异,无法对比不同整体的差异。

4.折线图 VS 面积图

1)可视化目标

  • 展示2019年上半年,全国承运包裹量趋势。
  • 展示2019年上半年,中通、圆通、申通三家快递公司的承运包裹量趋势。
  • 展示2019年上半年,全国及主流快递公司的承运量趋势。
  • 展示2019年上半年,主流快递公司的承运量占全国总承运量的趋势。

2)数据集准备

数据集1:全国承运包裹量

月份 销售额(元)
1月 300,000,000
…… ……
6月 430,000,000

数据集2:中通、圆通、申通三家快递公司的承运包裹量

月份 中通 圆通 申通
1月 30,000,000 24,000,000 26,000,000
……
6月 34,000,000 25,000,000 30,000,000

数据集3:全国及主流快递公司的承运量趋势

月份 顺丰 三通一达 EMS 其他快递
1月 32,000,000 50,000,000 10,000,000 8,000,000
……
6月 35,000,000 49,000,000 11,000,000 5,000,000

数据集4:主流快递公司的承运量占全国总承运量的趋势

月份 顺丰 三通一达 EMS 其他快递
1月 32% 50% 10% 8%
……
6月 35% 49% 11% 5%

3)图形对比

  • 折线图和面积图可以互换的情况:

《《七天数据可视化之旅》第五天:常用图表对比》

  • 折线图和面积图不能互换的情况:显示构成或占比时,应该使用面积图☞堆叠面积图or百分比堆叠面积图。

《《七天数据可视化之旅》第五天:常用图表对比》

4)总结

  • 相同点:

    • 折线图和面积图展示的是数据随时间的变化趋势,因此映射到X轴的数据类型一般为「时间/日期」。
    • 二者均可以展现一个或多个变量和时间的关系,这种关系包括,周期性变化、季节性变化、异常波动等。
    • 在大部分情况下,折线图和面积图是可以互换的。
  • 不同点:

    • 折线图:通过数据点的纵坐标来映射数值的大小,一般只用来表示数据的趋势。
    • 面积图:通过面积来映射数值的大小,「面积图」除了可以替换折线图外,还可以用来表示整体及其构成部分随时间的变化趋势。
  • 注意点:
    • 当使用面积图表示多系列的趋势时,需要对代表不同系列的面积区块颜色设置透明度,透明度可以减少不同系列之间的遮盖,帮助我们看到不同序列之间的重叠关系和更多信息。
    • 当一个图表中,系列值过多时,折线图会比面积图更直观,因为减少了系列的覆盖和重叠,能更清晰的看看到各个系列的趋势变化。

5.堆叠面积图 VS 百分比堆叠面积图

1)可视化目标

  • 若某家公司主要有电商、物流、云计算三块的业务,现需要展示2015~2019这五年,集团的年度收入趋势及其三大业务的收入趋势。
  • 若某家公司主要有电商、物流、云计算三块的业务,现需要展示2015~2019这五年,三大业务对集团的年度收入的贡献比例。

说明:假设集团有且只有这三项业务,且总收入=电商业务收入+物流业务收入+云计算业务收入。

2)数据集准备

数据集1:总收入构成

年份 第一产业 第二产业 第三产业
2015年 60,000,000 30,000,000 10,000,000
…… ……
2019年 100,000,000 60,000,000 40,000,000

数据集2:总收入贡献占比

年份 电商 物流 云计算
2015年 60% 30% 10%
…… ……
2019年 50% 30% 20%

3)图形对比

《《七天数据可视化之旅》第五天:常用图表对比》

4)总结

  • 相同点:
    • 堆叠面积图和百分比堆叠面积图,映射到X轴的均为【时间序列】。
    • 两者都可以展示各构成部分,随时间的变化趋势,只不过「堆叠面积图」的是构成部分的实际值随时间的变化趋势,「百分比堆叠面积图」展示的是构成部分的占比随时间的变化趋势。
  • 不同点:
    • 堆叠面积图:除了可以展示各构成部分随时间的变化趋势,还可以展示整体随时间的变化趋势
    • 百分比堆叠面积图:只能展示各构成部分占总体的比例随时间的变化,无法观测总体随时间的变化趋势。

      此外,从任何一个时间节点纵切下来,各部分占比之和必须为100%,即必须等于该节点的整体。

6.堆叠面积图 VS 堆叠柱状图

1)可视化目标

  • 展示某个国家,近6年来GDP的增长趋势及其三大产业的产值趋势。
  • 展示2019年第二季度,6大主流手机品牌的总出货量排名,及其各品牌在5大洲的出货量对比。

2)数据集准备

数据集1:三大产业产值单位为【元】

年份 第一产业 第二产业 第三产业
2013年 3,000,000 1,000,000 6,000,000
…… ……
2019年 5,000,000 2,000,000 10,000,000

数据集2:出货量单位为【部】

手机品牌 亚洲 欧洲 非洲 美洲 销售额(元)
Ipnone X 64G 黑色 130,000 90,000 50,000 40,000 20,000
…… ……
小米 60,000 20,000 40,000 20,000 10,000

3)图形对比

《《七天数据可视化之旅》第五天:常用图表对比》

4)总结

  • 相同点:
    • 堆叠面积图和堆叠柱状图的数据集格式类似,都是由「一个分类字段+多个连续数值字段」构成,且多个连续数值字段,是一个整体的各组成部分。
    • 两者都可以观测某一节点的总体数值和各组成部分的具体数值,都有数据对比的功能。
  • 不同点:
    • 堆叠面积图:堆叠面积图的分类字段,一般是时间序列

      当既需要分析整体随时间的变化趋势,又要了解整体的各构成项随时间的变化情况时,应该使用【堆叠面积图】。

      从其目的可以看出,堆叠面积图的分类字段(即时间序列),是按照时间的先后顺序排列的。

    • 堆叠柱状图:堆叠柱状图的分类字段,一般是非时间类型的分类数据

      当既要对比不同整体的数据大小,又要观测整体各构成项的数据大小时,应该使用【堆叠柱状图】。

      若整体的构成项过多,为了突出重点,需要对构成项进行重新归类,展示TOP5的分类,剩下则归为「其他」。

7.散点图 VS 气泡图

1)可视化目标

  • 展示华为不同型号手机的售价和成本的分布。
  • 展示华为手机不同型号手机的售价、成本和对应型号的销量。

2)数据集准备

数据集1:

手机型号 售价(元) 成本(元)
HUAWEI P30 3688 1400
HUAWEI P30 Pro 4988 1600
HUAWEI Mate 20 3199 1200
HUAWEI Mate 20 Pro 5099 2000
…… ……
HUAWEI nova 5 2799 1000

数据集2:

手机型号 售价(元) 成本(元) 销量(部)
HUAWEI P30 3688 1400 1,000,000
…… ……
HUAWEI nova 5 2799 1000 200,000

3)图形对比

《《七天数据可视化之旅》第五天:常用图表对比》

4)总结

  • 相同点:
    • 散点图和气泡图,均是用来展示数据分布情况的一种图形。
    • 散点图和气泡图,都是将两个字段映射到x,y轴的位置上,(x,y)的取值确定一个圆点或气泡在直角坐标系中的位置。
  • 不同点:
    • 散点图:一般用来展示二维数据(x,y)的分布,侧重于研究二维数据的两个变量x,y之间的相关性,如身高和体重之间的相关关系。

      散点图中,还可以展示多组数据系列的对比,比如男性身高体重和女性身高体重分布规律的对照。

    • 气泡图:一般用来展示三维数据(x,y,z)的分布情况,相较于散点图,气泡图增加了一个维度的数据展示,且将其数值映射到气泡的大小上。

      气泡图,也可以展示多组数据系列的分布,以发现不同系列的分布规律和差异。

  • 注意点:
    • 一般来说,散点图主要是用于研究数据集的分布规律和相关性,并不是很侧重去看每个数据点的具体取值。当数据集数量过大时,不适合将全部数据点展示在散点图中,此时需要对总体进行抽样显示,通常采用分层抽样的方法进行,但是分层抽样的依据和影响因素需要依据具体的业务场景而定。
    • 相较于散点图,气泡图不太适合过多数据容量的情况,气泡太多会使图表难以阅读。此外,对于气泡图中隐藏的一些数据信息,通常可以使用交互来辅助图标信息的阅读,如悬停显示详细数据、缩放观测被遮盖的数据点等。

0xFF 总结

不知不觉发现写的内容有点多😅,为了方便大家更快的获取信息,将图表对比部分进行了精简,参考如下:

《《七天数据可视化之旅》第五天:常用图表对比》

赘述一句:可视化之前,最重要的是弄清楚可视化的目的是什么,你期望展示或探索数据的什么规律。因为,这不仅决定了应该选择什么类型的图表,如何统计和组装你的数据集,也决定了可视化出来的结果是否能达到你的预期目标。

声明:以上图表数据纯属虚构,图形部分由Excel完成,部分由Sketch绘制。

点赞

发表评论

电子邮件地址不会被公开。 必填项已用*标注