- 4. 功能化艺术 - 肥胖与教育
- 9. 数据科学过程
- 14. Anscombe 四重奏
- 16. 数据类型
- 17. 识别数据类型
- 18. 视觉编码
- 19. 世界杯射手榜可视化的编码
- 20. 胜、负或平的可视化编码
- 21. 视觉编码的排序
- 22. 分解可视化图形
- 23. Facebook 募股
- 26. 在可视化光谱中穿梭
- 27. D3网页技术
- 29. 为什么选用D3？
4. 功能化艺术 - 肥胖与教育
参考:
- Alberto Cairo: Three steps to become a visualization/infographics designer (a Tableau version)
- A new data visualization tool: Flourish
这是一幅很好的可视化作品，肥胖与教育,线的左端表示学历，右端表示肥胖率，棕色的线表示低学历，高肥胖率，蓝色的线表示高学历，低肥胖率。
9. 数据科学过程
下图来自BenFry博士论文：
- 包含数据获取与解析，比如从网络数据中抓取,日志采集,数据库存取等，涉及到计算机科学
- 数据过滤与挖掘，这部分与数据科学练习最密切，涉及到统计与数据挖掘
- 呈现，涉及到可视化涉及
- 与观众有关，涉及到信息可视化和人机交互领域的技巧
上述的过程并不是瀑布式而是不断迭代的过程。
14. Anscombe 四重奏
下面的四个数据，有相同的均值，方差等统计要素，直接通过统计量无法看出差别，而可视化的图形上对其差异可以一目了然。
16. 数据类型
在统计学中，统计数据主要可分为四种类型，分别是定类数据，定序数据，定距数据，定比变量。
- 定类数据（Nominal）：名义级数据，数据的最低级，表示个体在属性上的特征或类别上的不同变量，仅仅是一种标志，没有序次关系。例如， ”性别“，”男“编码为1，”女“编码为2。
- 定序数据（Ordinal）:数据的中间级，用数字表示个体在某个有序状态中所处的位置，不能做四则运算。例如，“受教育程度”，文盲半文盲=1，小学=2，初中=3，高中=4，大学=5，硕士研究生=6，博士及其以上=7。
- 定距(定量)数据（Interval,quantitative）:具有间距特征的变量，有单位，没有绝对零点，可以做加减运算，不能做乘除运算。例如，温度。
- 定比变量（Ratio）:数据的最高级，既有测量单位，也有绝对零点，例如职工人数，身高。
17. 识别数据类型
- Doctor visits Per Year:Ordered
- Life Expectancy:Quantitative
- Spending Per Person:Quantitative
- Has Universal Healthcare:Nominal
18. 视觉编码
如下的变量称为视网膜变量，用图标的大小，颜色的等级来表示有序数据，比如国家的人口；用不同的颜色或不同性质的图标或不同文理，表示种类数据，比如国家。
19. 世界杯射手榜可视化的编码
可视化的编码方式：
| Variable | VisualEncoding |
|---|---|
| Country | position x |
| Goals Scored | size |
| Player | position x |
| Time | position y |
| TopScorer | color hue |
20. 胜、负或平的可视化编码
一个柱子表示一场球赛，柱子朝上表示win，朝下表示lose，☆表示该届世界杯冠军。
可视化的编码方式：
| Variable | VisualEncoding |
|---|---|
| Country | color hue |
| Game Win/Loss | postion y / orientation |
| Scoring Margin | position y / length |
| WorldCupWinner | shape |
| Time | position x |
21. 视觉编码的排序
左图表示传递信息的准确度，所以最重要的变量都用x和y轴表示。
22. 分解可视化图形
非常好的一篇文章Visual Encoding
23. Facebook 募股
参考图形：The Facebook Offering: How It Compares
26. 在可视化光谱中穿梭
D3使用了CSS/HTML/Javascript/SVG等开放网络技术。
关于上面涉及到的技术，更详细的参考：
27. D3网页技术
D3是Data Driven Documents的简称，即通过数据驱动文档，数据Data指如xml或json文件，文档Documents指html/svg元素，通过D3将数据与文档联系在一起。
- When does the DOM get created?
During Page load，在浏览器接收到html源的时候，就开始一点点的构建DOM对象。 - How can the DOM be accessed?
JavaScript API,本unit通过浏览器和JavaScript来解析DOM。 - The DOM is a specification and hierarchical object.
29. 为什么选用D3？
关于网页技术上的服务器端与客户端的执行，参考网页脚本：客户端与服务器端
使用D3的好处有:
- Leverages existing technologies(DOM,CSS,SVG,etc)
- Seperation of concerns
- Benefits from advances in browser related technologies(javascript,HTML5,etc)