这是我参与「第四届青训营 」笔记创作活动的第1天
01.什么是数据可视化
生活中的数据可视化:
-
手机的环形图
-
游戏地图
-
体温计示数
-
人类地图
-
词云
-
……
Anything that converts data into a visual representation(like charts,graphs,maps,sometimes even just tables)
数据可视化的分类:
- 科学可视化:科学实验数据的直观展示
- 信息可视化:对从抽象数据的直观展示
- 可视分析:对分析结果的直观展现,及交互式反馈,是一个跨领域的方向
为什么要数据可视化:
- 1.记录信息
- 2.分析推理
- 3.证实假设
- 4.交流思想
"安斯库姆四重奏"告诉我们作图的重要性。
02.可视化设计原则和方法
常见的数据可视化错误:
- 透视失真
- 图形设计&数据尺度
- 数据上下文
可视化设计原则:能够正确地表达数据中的信息而不产生偏差与歧义
-
准确地展示数据
-
节省笔墨
最大化数据墨水占比(Data-Ink Ration)=Data-ink/Total ink
-
节省空间
-
消除不必要的“无价值”图形
-
在最短时间内传达最多的信息
03.视觉感知
人类视觉系统观察的是变化,而不是绝对值,并且容易被边界吸引。
在可视化设计中,设计者需要充分考虑到人类感知系统的这些现象,以使得设计的可视化结果不会存在阻碍或误导用户的可视化元素。
格式塔学派
- 整体决定于部分的性质,部分依从于整体
GESTALT
- 就近原则(Proximity):容易把相邻的看作一组
- 相似原则(Similarity):相似的容易被看作一组
- 连续性原则(Continuation):更容易沿着物体的边界,将不连续的物体视为连续的整体。
- 闭合原则(Closure):人们常会忽略未闭合的特征
- 共势原则(Common movement):如果一个对象中的一部分都向共同的方向去运动,那么这些共同移动的部分就易被感知为一个整体。
- 对称性原则(Symmetry):对称的元素被看作同一组的一部分
- 图形与背景关系原则(Figure-ground)
04.视觉编码(Visual Encoding)
视觉编码是一种:
将数据信息映射成可视化元素的技术。
属性+值->可视化符号+视觉通道
05.面向前端地可视化工具介绍
- D3
由数据到图形驱动,比JQuery更复杂
- Vega
可视化语法,
- G2
可视化图形语法,与Vega类似
- ECharts