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

76 阅读2分钟

这是我参与「第四届青训营」笔记创作活动的的第9天

01 什么是数据可视化

Anything that converts data into a visual representation(like charts, graphs, maps, sometimes even just tables)

数据可视化分类

  • 科学可视化
    • 科学实验数据的直观展示
  • 信息可视化
    • 对抽象数据的直观展示
  • 可视分析
    • 对分析结果的直观展现,及交互式反馈,是一个跨领域的方向

为什么要可视化

  1. 记录信息
  2. 分析推理
  3. 证实假设
  4. 交流思想

02 可视化设计原则和方法

可视化设计原则

能够正确地表达数据中的信息而不产生偏差与歧义

  • 准确地展示数据
  • 节省笔墨
  • 节省空间
  • 消除不必要的“无价值”图形
  • 在最短时间内传达最多的信息

常见的错误可视化

  • 透视失真
    • 如果数字是由视觉元素表示的,那么它们应该与视觉元素的感知程度成正比。
    • 使用清晰、详细和彻底的标签,以避免图形失真和含糊不清。
  • 图形设计 & 数据尺度
    • 图形的每一部分都会产生对其的视觉预期(visual expectation):
      • 这些预期往往决定了眼睛实际看到的东西;
      • 错误的数据洞察,产生于在图形的某个地方发生的不正确的视觉预期推断。
    • 一个典型的例子:轴刻度,我们期望它从始至终能够保持连贯且一致。
  • 数据上下文

Data-ink ratio

最大化数据墨水占比

image-20220823230424057

两个擦除原则

  • 擦除非数据墨水
  • 擦除冗余的数据墨水

可视化设计方法

最重要的是展现数据

合理范围内,最大化数据墨水占比

03 视觉感知

格式塔理论(Gestalt Laws)

就近原则

相近原则

连续性原则

闭合原则

攻势原则

对称性原则

图形与背景关系原则

04 视觉编码

视觉编码是一种:

数据信息映射成可视化元素的技术。

数据信息:属性+值

可视化符号+视觉通道

05 基础统计图标

基础图标

  • 柱状图(Bar)
  • 饼图(Pie)
  • 散点图(Scatter)
  • 折线图

06 面向前端的可视化工具介绍

  • D3
  • Vega
  • G2
  • ECharts