Skip to main content
点击查看原文
“面积图”就是折线图吗? | 镝数鲜声#14

“面积图”就是折线图吗? | 镝数鲜声#14

2017-10-20 镝数 镝次元数据传媒实验室 镝次元数据传媒实验室

镝摘

上一期的气泡图是不是戳中你的心了?气泡图相对于散点图,最奇妙的地方莫过于气泡的大小也传达了一定的数据信息,可谓散点图的进阶版。

 

我们知道,有些图表一眼看上去会有点相似,就像散点图和气泡图、饼图和玫瑰图。所以你可能会说:面积图不就是给折线图涂上颜色的样子吗?No!这一期,我们就来看看面积图到底是什么。

 

面积图看上去就像层层叠叠的山脉,错落有致的外形下有表达时序的潜质。无论你想表示两种产品的销量差距,还是整理从50年代开始的流行音乐类型,似乎没有一种图表类型可以很好地表达随着时间变化,这些数据的变化情况,但面积图却可以做到。

 

那么,我们就来看看面积图是怎样帮助你表达这些变化情况的。

这个是最基本的、也是最常见的面积图,它表达的是从1月到6月,两种产品的销量变化情况。通过面积图,我们可以很的清楚地看到,在2月到3月之间,两种产品的销量差距变化情况。


如果使用折线图,虽然也能很清晰第反映出两种产品的销量变化情况,但最想强调的——差距变化的部分,则欠缺可视化的突出表现。

这个是基于上一个图表,使用镝数的“折线对比图”表达两个产品的销量变化情况。

谷歌的音乐时间线使用了一个面积图来表示自50年代以来,流行的音乐类型的情况。

 

你了解面积图吗?


面积图描述的是一个时间序列关系。但与折线图不同的是,面积图中带有颜色的面积也可以进行量的表达。

 

在面积图里,数据通过两条数轴表示,在图中用线把一个个数据点连接起来,数轴和这条线之间的区域通常用颜色或阴影来增加易读性。大多数情况下,面积图被用来比较两个或以上多个类别。

 

面积图的前世今生


如果你看过我们关于饼图(镝数鲜声#09——好吃饼图:角度展现占比和柱状图(镝数鲜声#07——条柱形图:即使简单也有规则)的玩法,你就会知道William Playfair是数据可视化领域的主要创新者,他发明了饼图和柱状图。当然,还有面积图。

第一个面积图“1786年的商业和政治地图集”


横轴为年份(1686年-1784年),位于右边的纵轴为单位(百万英镑),该图描述的是,在该时间段里国债利息的变化——在战争时期,国债利息发生了明显的变化。

 

面积图的种类


相较于表达个体数据,面积图在表达部分在整体中的变化趋势方面是完美的。

 

当要表达多数据系列中部分与整体的关系,或者是表达累加的数据集,堆叠面积图就派上用场了。

 

面积图主要有三种重要的变化形式,针对具体情况,每一种面积图都有它的最佳用法。

 

1.标准面积图


标准面积图适用于展示或者比较随着时间连续变化的定量。在需要绘制大量数据系列的情况下,折线图通常是更清晰的可视化表达方式(数据点被隐藏的解决方案详见下文的设计小贴士)。

2.堆叠面积图


堆叠面积图适用于可视化“部分-整体”的关系,这有助于我们展现各分类及总体的发展趋势和相互之间的关系。

 

值得注意的是,堆叠面积图与标准面积图不同,某一分类的值并非与纵坐标完全对应,而是通过折线之间的相对高度来表达。

 

因此堆叠面积图不会出现不同分类的数据点被遮盖、被隐藏的状况。


阿里研究院发布的《创新飞跃的五年——10大关键词解读中国互联网》报告中,则运用了堆叠面积图来比较4年来,双11包裹签收的峰值流量。

数据来源:阿里研究院《创新飞跃的五年——10大关键词解读中国互联网》

 

3.百分比堆叠面积图


百分比堆叠面积图适用于展现每个类别与整体的关系。在这种情况下,累加的总数不重要,我们要观察的是不同类别(例如Organic Search)在不同时间(例如JAN、FEB、MAR、APR)的相对高度以及与整体的关系

网易运用了三个百分比堆叠面积图,展示了美国不同收入组的所得税纳税份额、不同收入组的收入份额以及中国不同收入组的所得税纳税份额。


我们能非常清楚地看出,虽然美国的贫富差距在拉大,高收入群体的收入份额越来越高,但一直以来,他们缴纳的所得税份额不仅都大于收入份额,而且其增长速度也远超收入份额的增长。

数据来源:《美国10%的最高收入者贡献全国七成所得税》,网易,2014年2月11日。

 

面积图设计小贴士


面积图在可视化制作中越来越受欢迎,但如果没有合理的设计,它们表达的数据信息将很难传达出来,更别说理解了(下图是一个典型的反面例子——对比的类别太多,颜色太炫目,变化不清晰,易读性不强)。

数据来源:《2017年1月电影微博月报》,新浪微博数据中心,2017年3月13日。

 

为了数据表达能更加清晰,在设计面积图的时候,你要确保你做到了以下几点:

 

1.使用透明色


在标准面积图中,要注意把数据的极大值极小值都展现出来确保数据在背景中不被遮挡,所以在数据顺序上要深思熟虑并且使用透明色。

 

2.纵坐标从0开始

在设计面积图的时候,要注意从纵轴的0坐标上开始我们的可视化设计。


 
3.对比类别的数量不要太多


在进行面积图设计时,为了更好地突出重点,对比的类别不宜太多,否则重点不突出,降低了易读性。

 

一招避开图表可视化雷区


当Deadline逼近时,你可能没有那么多的时间去考虑配色、数据位置等问题。又或者你想要提高工作效率,想花最少的时间得到最优化的可视化效果。以上种种需求,镝数都帮你想到了!

 

无论是上面介绍到的堆叠面积图:

 还是百分比堆叠面积图:

它们都美美地收藏在镝数的近百个图表模板中,只要选择“线性图”类型,你就能快速地找到它们。录入你的数据,选择自己喜欢的配色(当然镝数原始模板的配色也很好看),就能生成专属你的可视化图表



看到这里,你还会觉得面积图是给折线之间涂上颜色的折线图吗?既然get到新图表,就赶紧到镝数用起来吧,你的数据可视化会变得更清晰、更有吸引力!

 

更多镝数使用问题请参看以下文章,如果仍有无法解决的问题,请发送邮件至public@dydata.io或者直接在后台留言。

 

点击阅读原文,即可了解更多内容!

 

咱们下期再见!

 

内容参考来源:

Data Visualization 101: Area Charts, ColumnFive, 2015.1.19.

https://www.columnfivemedia.com/data-visualization-101-area-charts

 

数据来源:

《美国10%的最高收入者贡献全国七成所得税》,网易,2014年2月11日。

http://data.163.com/14/0211/22/9KRAL9GE00014MTN.html

《创新飞跃的五年——10大关键词解读中国互联网》,阿里研究院,2017年10月9日。

http://www.aliresearch.com/blog/article/detail/id/21398.html

《2017年1月电影微博月报》,新浪微博数据中心,2017年3月13日。

http://weibo.com/2205075871/EzBGkffms?type=comment#_rnd1508074841127

 

往期文章:

镝数入门:三分钟,从数据到图表 #01

数据查找:数据都在这里 #02

数据上传:建立自己的数据小金库 #03

图表导出:微信文章如何查看动态图表?#04

会员功能:我们想给你更多 #05

省市地图:数据让每个城市鲜活都起来 #06

条柱形图:即使简单也有规则 #07

工作报表:用图表清晰展现你的业绩 #08

好吃饼图:角度展现占比 #09

时序数据:让时间看得见 #10

折线图表:锁定所有变化 #11

散点图表:让数据通俗易懂#12

气泡图表:比散点图更具表现力#13

 

编辑:陈淑晶

运营:张玉涵


点击查看原文
本文来自微信公众号:镝次元数据传媒实验室
发布时间:2017-10-20 21:21:28

微信号:dyclub-org
简 介:大数据时代,新闻不仅要用事实说话,更要用数据说话。“镝次元数据新闻”展现先驱媒体作品、传播数据开放理念,是一个融数据挖掘与分析、数据可视化技术等内容于一体的交流互动平台。



本站文章为自动抓取,如有相关转载权限问题
请邮件:admin@caup.net
其他推荐
 

用微信扫一扫