本文基于对DT时代下数据可视化概念进行解读与分析。在大数据时代大背景下，作为前端工程师，接触数据，使用数据，分析数据的次数会越来越多，开发数据可视化的应用也会越来越多。不管是使用Echarts.js,G2,HighCharts.js,SVG.js等已经封装好的高级可视化工具库，还是使用底层的d3.js,three.js,pixi.js等可视化数学库。我们都应该去了解数据可视化的一些基本概念，从而来让我们更好地去理解业务与需求。
1.数据可视化发展历程
| 年代 | 发展历程 |
|---|---|
| 15世纪-17世纪 | 可视化思想诞生初始,数据可视化的早期探索正式拉开序幕。 |
| 18世纪 | 数据可视化初步发展,直方图、柱状图、饼图、圆环图等开始出现。 |
| 19世纪前半叶 | 数据开始得到重视,数据图形出现。 |
| 19世纪后半叶 | 19世纪后半叶 |
| 20世纪前期 | 前期的可视化表达方式己经够用,图形表达的研宄并无新的进展。 |
| 20世纪中后期至今 | 数据可视化依附计算机科学与技术拥有了新的生命力,并将在不久的未来大放异彩。 |
2.数据可视化相关概念
广义上来说，数据可视化本身是一种泛称，它统一了较成熟的科学可视化和较年轻的信息可视化。而在大数据时代，除了包含这两种以外还囊括了在他们基础上发展起来的知识可视化以及结合了数据分析的可视化分析。
如下表，为可视化分类表：
| 类别 | 研究对象及其特点 | 研究目的 | 主要技术及表达方式 | 交互类型 |
|---|---|---|---|---|
| 数据可视化 | 包括空间、非空间数据等各种类型的大数据 | 将无意义的数据以含义丰富的形式表现出来，便于人们理解或提供启发、挖掘规律的可能 | 计算机图形、图像 | 人机交互 |
| 科学可视化 | 一般为具有几何属性的空间数据 | 将数据以真实可感的图形图像等方式表示，帮助人们更好理解相关概念和结果 | 计算机图形、图像 | 人机交互 |
| 信息可视化 | 非空间的，抽象、非结构化的数据集合，也可以是信息单元 | 以直观图像展现抽象信息，并帮助人们理解挖掘深层信息和含义 | 计算机图形、图像 | 人机交互 |
| 知识可视化 | 知识经过加工、整合和处理后在人脑中存储为知识结构的信息，可不断更新 | 用视觉表达的方法来描述知识，推动人们之间的知识等传播和创新 | 手绘或计算机草稿图、知识图表，视觉隐喻等等 | 人人交互 |
| 思维可视化 | 可不断更新的具有主观想法的知识结构的信息 | 用视觉表达的方法来描述知识，推动人们之间的观点、态度等的传播和创新 | 手绘或计算机草稿图，思维导图、概念图等 | 人人交互 |
| 可视化分析 | 包括空间、非空间数据等各种类型的大数据 | 变信息过载为机遇；使分析师或决策者能及时、高效地考察大量数据、信息流并完成分析推理和决策 | 计算机图形、图像，用户的知识、经验和主观认知 | 人机交互 |
[图片上传失败...(image-8050f3-1522675139611)]
3.数据可视化流程
Ben Fry在他的著作《可视化数据》里把数据可视化的流程分为了七步:获取、分析、过滤、挖掘、表示、修饰、交互。
[图片上传失败...(image-210c97-1522675139611)]
如上图，通常为了便于理解，可视化整体可分为三大部分：原始数据的转化-数据的视觉转化-界面交互。
上图为目前应用最广的可视化流程模型，后继几乎所有著名的信息可视化系统和工具都支持、兼容这个模型。
其实各类模型本质上还是离不开分析-处理-生成三步。
3.1 分析
- 任务：分析我们这次可视化的出发点和目标是什么？
- 数据：分析数据
- 领域：针对不同领域进行相应的分析
3.2 处理
- 数据处理：数据处理、数据规范、数据分析
- 设计视觉编码：指如何使用位置、尺寸、灰度值、纹理、色彩、方向、形状等视觉通道，以映射我们要展示的每个数据维度。（下文详细介绍）
3.3 生成
把之前的分析和设计付诸实践，在制作或写代码过程中，再不断调整需求、不断地迭代（有可能要重复前两步），最后产出我们想要的结果。
4.数据模型
数据可视化的主要任务是将数据转换为易于感知的图形。因此，为了更准确更形象的表达数据，我们需要了解一些数据相关的概念。
数据模型是一组数字或符号的组合，它包含数据的定义、类型等，可以进行各类数学操作等。
概念模型描述的是事物的语义或状态行为等。
现实世界可以用概念模型来描述，而概念模型又可以用数据模型来描述。经过两层抽象，数据便可以描述我们的现实生活中的方方面面。
数据类型
- 类别型：用于区分事物，例如水果分为苹果，香蕉等。
- 有序型：表示对象间的顺序关系，例如排名从高到低等。
- 区间型：用于对象间的定量比较，比如身高170-180cm之间的。
- 比值型：用于比较数值间的比例关系。例如，体重 80kg 是体重 40kg 的两倍。
| 数据类型 | 操作 | 集合操作 | 统计操作 |
|---|---|---|---|
| 类别型 | =、≠ | 互换元素位置 | 类别、模式、列联相关 |
| 有序型 | =、≠、>、< | 计算元素单调递增（减） | 中值、百分位数 |
| 区间型 | =、≠、>、<、+、- | 元素间线性加（减） | 平均值、标准方差、等级相关、积差相关 |
| 比值型 | =、≠、>、<、+、-、×、÷ | 元素间相似度 | 变异系数 |
视觉编码
视觉编码：描述的是将数据映射到最终可视化结果上的过程。
视觉通道：图形符号<——>信息<——>视觉系统
[图片上传失败...(image-84e59a-1522675139611)]
如上图所示，把图形符号分为两种：
- 位置变量：一般指二维坐标
- 视网膜变量：尺寸、数值、纹理、颜色、方向和形状
以上基本的图形符号共有 7 种。将其映射到点、线、面之后，就相当于有 21种编码可用的视觉通道。后来人们还又补充了几种其他的视觉通道：长度、面积、体积、透明度、模糊/聚焦、动画等，所以可用的视觉通道其实太多了。
视觉通道的三个性质
- 定性性质（或者叫分类性质）。适用于类别型数据。比如形状或颜色，这两个视觉通道，非常容易被人眼识别。
- 定量性质或定序性质。适用于有序型和数值型数据。比如长度、大小特别适合于编码数值/量的大小。
- 分组性质。具有相同视觉通道的数据，人眼也能很快识别出来，将其归为一组。
当然视觉通道还需要考虑：
- 色彩搭配
- 交互
- 美学因素
- 信息的密度
- 直观映射、隐喻
本文主要对大数据时代数据可视化的一些基本概念进行了总结，希望这篇文章能帮助到你。
参考文献
- [1]数据可视化基础
- [2]陈为 沈则潜 陶煜波. 数据可视化[M]. 电子工业出版社, 2013.
