1 . 什么是数据可视化?
anything that converts data into a visual representatioon(like charrts、graphs、maps,sometimes even just tables)
- 数据可视化可分为科学可视化 、信息可视化两部分
2 . why 数据可视化?
-
记录信息
-
分析推理
-
证实假设
-
交流思想
3 . 可视化设计原则和具体方法
能够正确表达数据中的信息而不产生偏差和歧义。
原则:
- 准确的展示数据
- 节省笔墨
- 节省空间
- 消除不必要的“无价值”的图形
- 在最短时间内传达更多的信息
4 . 感知
5 . 视觉编码
6 . 面对前端的数据可视化工具库
6 . 1 D3
D3 是数据可视化开源的 JavaScript 函数库 ,被认为最好的 JavaScript可视化框架之一。
6 . 2 Vega
Vega 是一种可视化语法 。通过声明式语言 ,可以用 JSON 格式描述可视化的视觉外观和交互行为 ,并使用 Canvas 或 SVG 生成视图。
6 . 3 G2
G2 可视化引擎 ,一套面向常规统计图表 ,以数据驱动的高交互可视化图形语法。一条语句即可使用 Canvas 或者 SVG 构建出可交互的统计图表。
补充 :什么是 canvas?
canvas 是一个可以使用脚本(通常为JavaScript)来绘制图形的 HTML 元素.
Canvas标签起初只是创造了一个固定大小的画布,它公开了一个或多个渲染上下文,而我们想对它进行绘制就需要找到渲染上下文。
补充 :什么是 svg?
- SVG是 Scalable Vector Graphics 的缩写 意为可缩放矢量图形
- SVG是一个基于文本的开放网络标准,用来定义用于网络的矢量图形
- SVG图像在放大或改变尺寸的情况下其图形质量不会有所损失,因此能够优雅而简洁地渲染不同大小的图形,并和CSS,DOM,JavaScript和SMIL等其他网络标准无缝衔接
- SVG 使用 XML 格式定义图形
- SVG是万维网联盟的标准与诸如 DOM 和 XSL 之类的 W3C 标准是一个整体
6 . 4 Echarts
Echarts 是一个使用 JavaScript 实现的开源可视化库 。