第1章 D3简介

1.1 D3是什么

1.1.1 D3简史

1.1.2 D3的优势

1.1.3 D3的适用范围

1.2数据可视化是什么

1.2.1目的

1.2.2构成要素

1.2.3相关概念

1.3图表种类

1.4学习方法

1.4.1预备知识

1.4.2学习顺序

1.4.3 D3难吗

第2章 Web前端开发基础

2.1浏览器和服务器

2.1.1浏览器

2.1.2服务器

2.2 HTML＆CSS

2.2.1 HTML元素

2.2.2 CSS选择器

2.3 JavaScript

2.3.1在HTML中使用JavaScript

2.3.2语法

2.3.3变量

2.3.4数据类型

2.3.5操作符

2.3.6语句

2.3.7函数

2.3.8对象

2.3.9数组

2.4 DOM

2.4.1结构

2.4.2访问和修改HTML元素

2.4.3添加和删除节点

2.4.4事件

2.5 SVG

2.5.1位图和矢量图

2.5.2图形元素

2.5.3文字

2.5.4样式

2.5.5标记

2.5.6滤镜

2.5.7渐变

2.6 Canvas

2.6.1开始绘图

2.6.2状态机

2.6.3基本图形

2.6.4文字

2.6.5变形

2.6.6图片

2.6.7渐变

2.7色彩基础

2.7.1颜色空间

2.7.2色相环

2.7.3配色基础

2.7.4配色的心理效果

第3章 准备开发环境

3.1下载D3

3.1.1通过本地引用

3.1.2通过网络引用

3.2安装Chrome和Sublime Text

3.3安装Apache HTTP Server

3.4 Hello World

3.5绘制矢量图

3.6调试

第4章 D3基础：选择集与数据

4.1选择元素

4.2选择集

4.2.1查看状态

4.2.2设定和获取属性

4.3添加、插入和删除

4.4数据绑定

4.4.1 datum（）的工作过程

4.4.2 data（）的工作过程

4.4.3绑定的顺序

4.5 update、enter、exit

4.5.1 enter的处理方法

4.5.2 exit的处理方法

4.5.3数据更新时的处理模板

4.6选择集的常用方法

4.6.1过滤filter

4.6.2排序sort

4.6.3遍历each

4.6.4传递call

4.7数组的常用方法

4.7.1排序

4.7.2求值

4.7.3生成和操作

4.7.4映射

4.8柱形图

4.8.1添加矩形和文字

4.8.2更新数据

第5章 比例尺和坐标轴

5.1定量比例尺

5.1.1线性比例尺

5.1.2指数比例尺和对数比例尺

5.1.3量子比例尺和分位比例尺

5.1.4阈值比例尺

5.2序数比例尺

5.3坐标轴

5.3.1绘制方法

5.3.2刻度

5.3.3各比例尺的坐标轴

5.4散点图

第6章 绘制

6.1颜色

6.1.1 RGB

6.1.2 HSL

6.1.3插值

6.2线段生成器

6.3区域生成器

6.4弧生成器

6.5符号生成器

6.6弦生成器

6.7对角线生成器

6.8折线图

第7章 动画

7.1过渡效果

7.1.1创建过渡

7.1.2过渡的属性

7.1.3子元素

7.1.4事件监听和调用

7.1.5过渡的样式

7.2散点图的过渡效果

7.2.1绘图准备

7.2.2应用过渡的散点

7.2.3绘制坐标轴

7.2.4更新数据的事件

7.2.5结果

第8章 交互

8.1监听器

8.1.1鼠标

8.1.2键盘

8.1.3触屏

8.2事件d3.event

8.2.1事件的种类

8.2.2容器的相对坐标

8.3行为d3.behavior

8.3.1拖曳

8.3.2缩放

第9章 导入和导出

9.1文件导入

9.1.1 JSON

9.1.2 CSV

9.1.3 XML

9.1.4 TEXT

9.2文件导出

9.2.1导出为SVG文件

9.2.2编辑矢量图

第10章 布局

10.1饼状图

10.2力导向图

10.3弦图

10.4树图

10.5捆图

10.6直方图

10.7矩阵树图

第11章 地图的基础

11.1地图的数据

11.1.1下载

11.1.2简化

11.1.3 GeoJSON

11.1.4 TopoJSON

11.2中国地图

11.2.1基于GeoJSON

11.2.2基于TopoJSON

11.3地理路径

11.3.1地理路径生成器

11.3.2形状生成器

11.4投影

第12章 友好的交互

12.1提示框

12.1.1饼状图的提示框

12.1.2提示框的样式

12.2坐标系中的焦点

12.2.1折线图的焦点

12.2.2为折线图添加提示框

12.3元素组合

12.3.1饼状图的拖曳

12.3.2移入和移出

12.3.3合并

12.4区域选择

12.4.1在SVG画板里选择一块区域

12.4.2散点图的区域选择

12.5开关

12.5.1思维导图的构造思路

12.5.2思维导图的制作

第13章 地图的应用

13.1值域的颜色

13.2标注

13.2.1标注地点

13.2.2夜光图

13.3标线

13.3.1带有箭头的标线

13.3.2球面地图的标线

13.4拖曳和缩放

13.4.1平面地图

13.4.2球面地图

13.5力导向地图

13.5.1 Voronoi图和Delaunay三角剖分

13.5.2力导向的中国地图

第14章 D3 4.x简介

14.1 4.x的新功能

14.2 3.x如何升级到4.x

14.2.1加载文件的变化

14.2.2布局的变化规则

14.2.3生成器的变化规则

14.2.4比例尺的变化规则

14.2.5升级小结

14.3 D3 4.x的设计思想

14.3.1 3.x和4.x的结构区别

14.3.2模块化的优点

14.3.3可阅读性和自我解释

14.4未来展望

14.4.1模块发展的百花齐放

14.4.2应用范围扩大

14.4.3第二核心、第三核心

第15章 D3 4.x新功能剖析

15.1全新的力导向图

15.1.1力的作用

15.1.2控制时间

15.1.3给Canvas添加拖放事件

15.1.4 4.x版完整的力导向图

15.2丰富多彩的调色板

15.2.1配色模板

15.2.2 d3-color

15.3功能倍增的图形生成器

15.3.1折线图和线段生成器

15.3.2消失的对角线生成器

15.3.3更简单的坐标轴

15.4更合理的布局

15.4.1堆栈图的数据结构

15.4.2从思维导图来探究d3-hierarchy

15.4.3全新的打包图d3.pack

15.5无限循环的过渡效果

15.5.1单元素的无限过渡

15.5.2多元素的无限过渡

第16章 D3 4.x在地图上的应用

16.1 Canvas地图的基本功能

16.1.1填充和描边

16.1.2选择区域

16.1.3拖曳和缩放

16.2地图上飞舞的流星

16.2.1 Canvas的流星效果

16.2.2地图两点间的流星

16.3地球仪

16.3.1 4.x的形状生成器

16.3.2 Canvas球面地图的旋转和缩放

16.4结合Leaflet.js和D3.js

16.4.1 LeafLet.js的简介和安装

16.4.2载入地图

16.4.3加入标注

16.4.4添加SVG或Canvas到地图上

附录A 彩色插图

参考文献