数据可视化基础|青训营笔记

89 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的第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