数据可视化基础|青训营笔记
这是我参与「第四届青训营 」笔记创作活动的第16天
什么是数据可视化
"Anything that converts data into a visual representation (like charts graphs maps something eveb just table)" 任何可以将数据转换成可视化表示的东西(比如图表、图表、地图、表格)
- 利用数据可视化我们能根据杂乱无章的数据更快的得出想要的结论，验证我们对数据结果的猜想。因此，掌握数据可视化技术是有必要的。
可视化设计原则
- 能够正确的表达数据中的信息而不产生偏差与歧义
- 节省笔墨
- 节省空间
- 消除不必要的“无价值”图形
- 在最短的时间内传达最多的信息
常见的错误可视化
- 透视失真
- 图形设计&数据尺度
- 数据上下文
透视失真
- 如果数字是由视觉元素表示的，那么它们应该与视觉元素的感知程度成正比
- 使用清晰、详细和彻底的标签，以避免图形失真和含糊不清
图形设计&数据尺度
图形的每一部分都会对其的视觉预期：
- 这些预期往往决定了眼睛实际看到的东西
- 错误的数据洞察，产生于在图形的某个地方发生的不正确的视觉预期推断
最大化数据墨水占比（Data-Ink Ratio）
- 可视化图形由墨水和空白区域构成
- 数据墨水：可视化图形中不可擦除的核心部分
- 擦除数据墨水将减小图形所传达的信息量
- 数据墨水战必：可视化图形中用于展示核心的“墨水”在整体可视化所用的墨水比例
基础的统计图表
- 柱状图
- 饼图
- 散点图
- 折线图
面向前端的可视化工具
D3
D3.js是用于数据可视化的开源的Javascript函数库，被仍未是最好的Javascript可视化框架之一
Vega
Vega是一种可视化语法，通过其声明式语言，可用JSON格式描述可视化视觉外观和交互行为，并使用Canvas或SVG生成视图
G2
一套面向常规统计图表，以数据驱动的高交互可视化图形语法，具有高度的易用性和扩展性。使用G2，你可以无需关注图表各种繁琐的实现细节，一条语句即可使用Canvas或者SVG构建出各种各样的可交互的统计图表
ECharts
一个使用Javascript实现的开源可视化库，可与流畅的运行在PC和移动设备上，兼容当前绝大部分浏览器（IE9/10/11，Chrome，Firefox，Safari等），底层依赖矢量图形库ZRender，提供直观，交互丰富，可高度个性化定制的数据可视化图表。
