好久不贱。
可爱的我又回来了。
今天天气冷,我们聊一个比较高大上的。
昨天,一周君在电视节目中看到了这个。
。。。。
不好意思,放错了。
是这个
这是淘宝双十一晚会中,用来展现整个商城整体销量的数据展示大屏。
无独有偶。
电影节目中,也能看到这类相似的情景。
因为过于酷炫,许多小伙伴非常想学。
但有意思的是,绝大多数小伙伴连名字都弄。不。清。楚。。。。
「那个转转的地球......」
「酷炫的科技效果......」
「看起来很牛逼......」
咳咳。。
听清楚了,这种数据展现效果呈现有着不同的载体,每种载体有着不同的名称。
但是统一可以将之称为。
【数据可视化】
DATA VISUALIZATION
【1】什么是数据可视化?
从专业的角度上来讲,数据可视化是一个属于计算机方面的学科,多用于数据分析与预测方面。
当然,要是这样解释,就太。空。乏。了。
举个栗子
我们无时无刻产生都在产生大量数据;
比如我们的住址,起床时间,身高,体重,年龄,早饭吃的什么,晚饭吃的什么。
假如这些数据被一个统一的仪器收集起来,存在一个文档里面。
因为单位不同,数据格式不同,使用的场景不同,导致收集起来的数据凌乱没有任何规律;
是没有任何关联,所以没有任何的价值。
而这个时候,我们需要通过一些工具去将这些凌乱的数据进行一些整理。
比方说,借助一个工具,我们可以在凌乱的数据库中,分别将住址,起床时间,提取出来列成一个单独的规范的数据表。
这个数据再通过一些简单的分析,我们可以得出一个结果「你家小区住户的平均起床时间分布」
这个结果有价值么?显然这对小区门口的早餐包子店铺非常有价值。
但是因为小店老板的文化水平有限,呈现出的结果报表维度太多,他看不懂啊。。。
这个时候就需要通过一些图示化的手段,提取出最重要的几个数据维度「起床时间」「人群」「区域」做一个小店老板能够轻松看懂的的「数据报表」
以上就是一个完整的数据可视化的过程。
在专业的术语里面,
利用手段,收集数据,这个步骤叫做「数据收集」
将凌乱的数据整理成规范的文档,这个步骤,叫做「数据清洗」
而精简维度,用可视化的手段做出一个人人都能看懂的报表的过程,这个步骤,叫做「视觉化呈现」
「数据收集」+「数据清洗」+「视觉化呈现」叫做「数据可视化」
以上的每个步骤,都离不开专业的公司,专业的人士与专业的工具。
但千万别把数据可视化想的太难,其实无非就是帮助理解。
甚至狭义讲起来,你就认为是「用图表展现数据」就行了。
(我解释的是不是很通俗易懂~?)
但是,为什么数据可视化又能成为一名专业的学科呢?
因为需要考量的因素太多了。
首先是数据量,
正产人可以用常用的图表类型展现几组,几十组,几百组,甚至勉勉强强几千组数据。
但是假如数据到达了十万,百万,千万,乃至过亿级呢?
另外是多方面的复杂因素缠绕,导致无法回到需求本身;
又一个非常典型的栗子。
伦敦地铁线路图演变史;
按照传统的地图思路,设计师应该将线路图和实际地理位置对应准确。
结果这样基于实际的线路图却复杂到让整个伦敦绝望了。
实际的站台地理距离有长有短,方位差距过远,整个地图在地铁线路多的市区,站点过多,在线路图上显得非常拥挤不堪无法看清文字,而郊区位置则是大量松散的留白;
直到1926年,Fred Stingemore 去掉了背景繁杂的地图,调整了每个站台点的地图上的距离,让线路和实际有所偏差,才让整个线路图得到了改善。
但是这样的地图依旧不够均匀,线路交集较多的区域,繁杂的站点还是在线路图中显得过于拥挤;
直到1931年,Harry Back 的线路图彻底脱离了真实地理的局限,让地铁线路图呈现水平,垂直和对角线延伸,才让现代的地铁线路图得以出现;
就这么10条地铁线路图,伦敦足足花了10年才设计出一个满意的结果。
更何况现今爆炸的数据时代?
但复杂的领域,不是我们要讨论的重点,
我们来说些有意思的;
在数据可视化中,视觉化呈现是最有意思的一个部分。
@Anna Vital 这个漂亮小姐姐,在信息图工具adioma上有一篇文章,讲的是视觉化的思考。
@Anna Vital
「如何用类比来进行视觉化思考」
https://blog.adioma.com/how-to-think-visually-using-visual-analogies-infographic/
这里面提出了一个非常有意思的观点:可视化好坏的判断标准,是指能否方便理解。
而在视觉化呈现的时候,如果使用相似,类比的事物则更容易进行读者理解。
@Anna Vital 做了一个理解梯度,从上往下,愈发容易人们方便理解。
我们一般使用的普通图表,饼图,折线图,柱状图,是简单的抽象图表范畴。
而像漏斗图,仪表盘,天平等则属于抽象类比的范畴,看起来像是现实中存在,但是被简化和抽象的事物。
像冰山图,钟表图,洋葱图等则已经是属于真实的类比,看起来就像是我们平时能够接触到的事物。
而食物链,马拉松,进化这种是属于本身就已经自带含义的寓言试图表,本身就会带上比如时间,高度,地域等自带的维度。
从这篇文章中,我们可以看出来,其实可视化程度越高,就越靠近人类最熟悉的事物。
实际上,数据可视化这东西,看起来高大上,但人人都可以做。
在美帝的一位萌萌哒的妹子 @lisacrast 做了一个实验——
她想用气泡图统计2015年187个国家的人均GDP和人口;
她使用了12种不同的数据可视化工具,来呈现这个图表。
其中有,Processing、D3.js、RAW 之类专业的代码数据可视化工具。
也有 TEABLEAU、Lyra 之类的专业桌面数据可视化产品
也有 EXCEL、Google表格 之类的我们常见的办公数据处理工具
甚至还闲着蛋疼的用到了 AI 这个专业的设计软件。
(什么鬼??)
最终,虽然软件的使用难度和具体的操作方式都不一样,但是最终都能够得到想要的结果。
这也就说明了。。。
数据可视化别看它很高冷。
其实只要掌握对了工具,
想怎么玩弄它,就能怎么玩弄它。
上面可能略微有一点冷场。。。
接下来,
我们来看一些比较风骚的。。
【2】有意思的数据可视化案例
1.全球气象洋流图
https://earth.nullschool.net/
这是一个实时更新,能够用来展示全球当前气候的数据可视化案例,
一共提供了9种不同的查看模式;
只要在左下角简单配置一下,就可以展示的内容包括,海洋,化学污染物和颗粒物;
虽然。。。你们应该只认识一个PM2.5。。。
2.三维地球
http://gallery.echartsjs.com/editor.html?c=xSk7XrQKpl&v=3
一个能够自转的三维地球,从地形到纹理,做的都非常精致;
恩。。。地理课可以用来装装逼。。。
3.磁性颗粒
http://gallery.echartsjs.com/editor.html?c=xH1-8P6ST-
提供了红绿两个带有磁性的点;
绿色的小点用来让粒子交汇;
而红色的小点用来让粒子避开;
这个用处。。。
我真想不到。。
在线等,挺急的。。。
4.音乐像素
http://gallery.echartsjs.com/editor.html?c=xBkkLDElkZ
这不是一般的立体像素
它是数据可视化的小马哥。。。
这是一个自带BGM的立体像素。
而且会跟着节奏跳动。
感受到TA内心的澎湃了么
5.开普敦计程车车流量
http://gallery.echartsjs.com/preview.html?c=xrJHCfsfE-&v=2
运用了三维效果配上光亮线段来实时展现开普敦计程车流量的数据可视化。
你问他用处?
恩。。。总之。。
看起来挺酷的吧。。。
有了小汽车,那当然会有小灰机。
6.航空公司线路图
http://gallery.echartsjs.com/editor.html?c=xHJN4TV5pg
我们在左上角选择不同的航空公司,地图上会用紫色的发光线段来展现选中的航空公司的线路;
因为以上都是用代码去实现的效果,
所以具体修改与实现。。
你要先成为一名程!序!员!
具体请参考↓↓
「CHART官方文档」
http://echarts.baidu.com/feature.html
「W3SCHOOL」
http://www.w3school.com.cn/
所以
以上。。。
好像目前为止,我们应该都用不上。。。
但是,通过一个下午的自学了CSS以后,我发现
其实如果硬来的话,做一些小修改,其实还是有可能的。
比如,在开普敦计程车线路图中,
我们在左侧的代码中,尝试找寻到 color 这一行代码;
然后将rbg 数值改为白色(255,255,255)
然后点击一下右上角的刷新。
等!等!等!等!
你看,线路是不是就变成白色的了?
同理,各种航线效果也是一样可以改为白色。
厉害了吧?
我是不是很棒棒?
除此之外,你也可以愉快的设置一下比如线段宽度,透明度之类的效果。
(虽然,我也感觉没什么好设置的。。。)
嘿嘿嘿,虽然没什么卵用
生活虽然如此悲伤,但还是要继续,让我们打开另一个数据可视化的神器
Voxelize image
http://gallery.echartsjs.com/editor.html?c=xS1l7vPPwW
(http://gallery.echartsjs.com/editor.html?c=xS1l7vPPwW)
打开之后,略微有一点失望。
有点平淡无奇。
但是!!!
这个时候,我们点击屏幕右下角的
英文不好,应该是上传的意思。
选择一张浓墨重彩的图片上传。
Voxelize image 就会根据图片,自动生成立体像素效果!!!
如果你再稍微挑逗一下右上角的数值
甚至还能够很方便的得出这样性感迷人的效果。
牛逼!!!!
多嘴一句。
上面的五个非常牛x的可视化demo
都是来自于百度Echart 项目组的@pissang
嗯,大神的微博传送门在这,没事去膜拜一下吧。
https://weibo.com/pissang?topnav=1&wvr=6&topsug=1&is_all=1
在介绍一个厉害的。
PIXELMAP
https://pixelmap.amcharts.com/#
这是一个敲击酷炫的地图生成工具,一共内置了6种不同的地图模板。
除了世界地图外,你只要轻轻的输入国家的名称。
然后等待两秒钟。
你就会发现你要的国家地图就展现在你面前啦!
甚至还自带了省份。
如果需要作为矢量素材,直接点击右下角SVG格式下载即可。
把素材插入到PPT里面,可以随意修改颜色哦~
恩。。。
无用的东西讲的太多,你们会认为这篇文章太水。。
还是讲一点能用得上的吧。
【3】还有哪些数据可视化的大杀器
1.图表秀
http://www.tubiaoxiu.com/
这是一款致力于通过简单几步就能制作出炒鸡美观图表的工具网站。
我们只要在EXCEL中罗列好具体的数据,
然后上传到图表秀中的;
就能够一键生成漂亮的图表!
更可怕的是,图表秀还自带了一系列非常漂亮美观的模板!!!
嗯,给你们看看画风。
嗯,把上面随便哪个截个屏就可以吓死老板了。
2.百度图说
http://tushuo.baidu.com/
这是百度ECHART项目组给我们这种零基础代码小白准备的图表军火库
一共提供了包括仪表图,地图在内25种图表。
我们选择图表之后,可以点击参数调整对颜色,格式,文字格式等进行调整
如果想调整数据,点击图表,选择数据编辑随意调教即可。
3.PPT
没错,就是投影的那个PPT。
在数据可视化时代,PPT仿佛一直被人轻视。
今天,我想为PPT正个名。
就以PPT中的图表直方图为例。
看起来这个直方图非常简单,但其实我们只要在绘制出一个三角形元素,然后选中直方图,轻轻的按一下CTRL+V
就可以得出这样子的图表。
同理,如果你绘制的元素很有创意,也可以得到各种各样有趣的图表。
如果你想学习更多图表的知识,可以点击这一篇文章。
4.EXCEL
EXCEL中,有两个让人惊吓的可视化神器。
1.POWERVIEW
一个简单易上手的报表生成工具。
因为之前讲过,所以具体文章不用赘述,大家想学习,可以看这篇文章。
2.POWERMAP
EXCEL甚至能够生成三维地图!
(哦。。我的小心脏。。)
这也是一个一周重复了好多遍的功能介绍,如果想学习POWERMAP,请戳这一篇文章。
经典教程 | PowerMap, Excel领域的可视化人间凶器
虽然,以上推荐的工具都很酷炫;
但,以上的几种工具要么太难,或者都偏向于图表,仅仅局限于一个工作场景;
然而数据可视化使用的场景很多,其实更多需要一个多方面小能手。
接下来给大家介绍一个综合实力最强的,
一周君最喜欢的一个工具;
接下来有请嘉宾闪亮登场;
5.Banber数据简报
http://www.banber.com/library
别看首页长得丑不拉几的。。。
但相对于其他几个工具,Banber最大的特点是综合实力强大;
号称数据可视化界的西毒欧阳锋;
Banber可以设置非常多的页面尺寸,从信息图,到手机页面,甚至到PC页面,数据大屏,页面的尺寸都可以随意的定义。
当然,作为一个数据可视化工具,Banber的图表效果只多不少,并且支持导入EXCEL数据功能,实现数据可视化。
最强的在于,甚至可以关联企业数据库,做到实时更新;
相对于其他工具单一的图表功能,Banber更像是一个集在线设计工具与EXEL的完美结合体!!
因为除了图表以外,还囊括了贼多的的免费素材。
包括图标,图片和模板,涵盖了各行各业,并且,全都支持免费可商用;
也就是说,除了图表,我们写文章,做PPT,做海报,都能用BANBER全部搞定!!
更过分的是。
我们创建完作品之后,可以直接一键分享到手机端和PC端,在线完美查看作品;
我们可以看看一些大神做出来的效果
关键是,这么多强大的功能,全免费。
后面我才了解到,
这款工具的产品经理是@陈理老师
你可能不知道他,但是他以前负责软件你一定用过。
陈理老师以前是WPS的产品经理,这正是他从金山离职以后,独自创业的产品。
非常用心,点个赞。
最后,我向陈理老师要了banber的产品的介绍放在了阅读原文
本身这篇介绍也是用banber做的,相信你看完之后,会跟我一样爱上这款简单,好用的可视化工具。
最后,没啥可说的。
您2017已余额不足
2017年已经快结束了。
那就给大家拜个早年吧。
我是一周君,我们下周应该见不了。
下课。
*表情效果来自汪蛋系列表情包,感谢设计师@汪