D3.js数据可视化实战手册

第1章　D3．js入门指南　1
1．1　简介　1
1．2　搭建一个简易的D3开发环境　2
1．2．1　准备阶段　2
1．2．2　搭建环境　2
1．2．3　工作原理　3
1．2．4　更多内容　4
1．3　搭建一个基于NPM的开发环境　5
1．3．1　准备阶段　5
1．3．2　搭建环境　5
1．3．3　工作原理　6
1．3．4　更多内容　7
1．4　理解D3风格的JavaScript　9
1．4．1　准备阶段　9
1．4．2　开始编程　9
1．4．3　工作原理　10
1．4．4　更多内容　14
第2章　精挑细选　16
2．1　简介　16
2．2　选择单个元素　18
2．2．1　准备阶段　18
2．2．2　开始编程　18
2．2．3　工作原理　18
2．3　选取多个元素　20
2．3．1　准备阶段　20
2．3．2　开始编程　21
2．3．3　工作原理　21
2．4　迭代选集中的元素　21
2．4．1　准备阶段　21
2．4．2　开始编程　22
2．4．3　工作原理　22
2．5　使用子选择器　23
2．5．1　准备阶段　23
2．5．2　开始编程　24
2．5．3　工作原理　24
2．6　函数级联调用　26
2．6．1　准备阶段　26
2．6．2　开始编程　26
2．6．3　工作原理　27
2．7　处理原始选集　28
2．7．1　准备阶段　28
2．7．2　开始编程　28
2．7．3　工作原理　29
第3章　与数据同行　31
3．1　简介　31
3．2　将数组绑定为数据　34
3．2．1　准备阶段　34
3．2．2　开始编程　34
3．2．3　工作原理　35
3．3　将对象字面量绑定为数据　39
3．3．1　准备阶段　39
3．3．2　开始编程　39
3．3．3　工作原理　41
3．4　将函数绑定为数据　42
3．4．1　准备阶段　42
3．4．2　开始编程　42
3．4．3　工作原理　44
3．5　如何处理数组　46
3．5．1　准备阶段　46
3．5．2　开始编程　46
3．5．3　工作原理　48
3．6　数据的过滤　50
3．6．1　准备阶段　50
3．6．2　开始编程　50
3．6．3　工作原理　52
3．7　基于数据的图形排序　53
3．7．1　准备阶段　53
3．7．2　开始编程　53
3．7．3　工作原理　55
3．8　从服务器加载数据　56
3．8．1　准备阶段　56
3．8．2　开始编程　57
3．8．3　工作原理　59
第4章　张弛有“度”　60
4．1　介绍　60
4．2　使用数值尺度　62
4．2．1　准备阶段　62
4．2．2　开始编程　62
4．2．3　工作原理　64
4．2．4　更多内容　66
4．3　使用时间尺度　66
4．3．1　准备阶段　67
4．3．2　开始编程　67
4．3．3　工作原理　68
4．3．4　更多内容　69
4．3．5　请参见　70
4．4　使用有序尺度　70
4．4．1　准备阶段　70
4．4．2　开始编程　71
4．4．3　工作原理　72
4．5　字符串插值　74
4．5．1　插值器　74
4．5．2　准备阶段　75
4．5．3　开始编程　75
4．5．4　工作原理　76
4．5．5　更多内容　77
4．6　颜色插值　77
4．6．1　准备阶段　77
4．6．2　开始编程　77
4．6．3　工作原理　79
4．6．4　请参见　80
4．7　复合对象插值　80
4．7．1　准备阶段　80
4．7．2　开始编程　80
4．7．3　工作原理　82
4．8　实现自定义插值器　83
4．8．1　准备阶段　83
4．8．2　开始编程　83
4．8．3　工作原理　85
4．8．4　请参见　88
第5章　玩转坐标轴　89
5．1　简介　89
5．2　坐标轴基础　89
5．2．1　准备阶段　89
5．2．2　开始编程　90
5．2．3　工作原理　92
5．3　自定义刻度　95
5．3．1　准备阶段　95
5．3．2　开始编程　95
5．3．3　工作原理　96
5．4　绘制表格线　97
5．4．1　准备阶段　97
5．4．2　开始编程　97
5．4．3　工作原理　99
5．5　动态调节坐标轴尺度　101
5．5．1　准备阶段　101
5．5．2　开始编程　102
5．5．3　工作原理　104
第6章　优雅变换　106
6．1　简介　106
6．2　单元素动画效果　107
6．2．1　准备阶段　107
6．2．2　开始编程　108
6．2．3　工作原理　108
6．3　多元素动画　109
6．3．1　准备阶段　110
6．3．2　开始编程　110
6．3．3　工作原理　112
6．4　使用缓动函数　115
6．4．1　准备阶段　115
6．4．2　开始编程　115
6．4．3　工作原理　117
6．5　使用中间帧计算　118
6．5．1　准备阶段　119
6．5．2　开始编程　119
6．5．3　工作原理　120
6．5．4　更多内容　121
6．6　使用级联过渡　122
6．6．1　准备阶段　122
6．6．2　开始编程　122
6．6．3　工作原理　123
6．7　使用选择性过渡　124
6．7．1　准备阶段　124
6．7．2　开始编程　124
6．7．3　工作原理　125
6．7．4　请参见　126
6．8　监听过渡事件　126
6．8．1　准备阶段　126
6．8．2　开始编程　126
6．8．3　工作原理　127
6．9　实现自定义插值器　128
6．9．1　准备阶段　128
6．9．2　开始编程　129
6．9．3　工作原理　130
6．10　使用定时器　130
6．10．1　准备阶段　130
6．10．2　开始编程　131
6．10．3　工作原理　132
6．10．4　请参见　133
第7章　形状之美　134
7．1　简介　134
7．1．1　什么是SVG?　135
7．1．2　矢量　135
7．1．3　可伸缩性　135
7．2　创建简单形状　136
7．2．1　准备阶段　136
7．2．2　开始编程　136
7．2．3　工作原理　137
7．2．4　更多内容　138
7．2．5　请参见　139
7．3　使用线条生成器　139
7．3．1　准备阶段　140
7．3．2　开始编程　140
7．3．3　工作原理　141
7．3．4　请参见　143
7．4　使用线条插值　143
7．4．1　准备阶段　143
7．4．2　开始编程　143
7．4．3　工作原理　146
7．5　更改线条的张力　147
7．5．1　准备阶段　147
7．5．2　开始编程　147
7．5．3　工作原理　149
7．6　使用区域生成器　150
7．6．1　准备阶段　150
7．6．2　开始编程　150
7．6．3　工作原理　152
7．7　使用区域插值　153
7．7．1　准备阶段　153
7．7．2　开始编程　153
7．7．3　工作原理　156
7．7．4　更多内容　156
7．7．5　请参见　156
7．8　使用圆弧生成器　156
7．8．1　准备阶段　156
7．8．2　开始编程　157
7．8．3　工作原理　158
7．9　实现圆弧过渡　159
7．9．1　准备阶段　160
7．9．2　开始编程　160
7．9．3　工作原理　161
7．9．4　更多内容　163
7．9．5　请参见　163
第8章　图表美化　164
8．1　简介　164
8．2　创建线图　166
8．2．1　准备工作　166
8．2．2　开始编程　166
8．2．3　工作原理　168
8．3　创建面积图　172
8．3．1　准备工作　173
8．3．2　开始编程　173
8．3．3　工作原理　175
8．4　创建散点图　176
8．4．1　准备工作　176
8．4．2　开始编程　176
8．4．3　工作原理　178
8．5　创建气泡图　180
8．5．1　准备工作　180
8．5．2　开始编程　180
8．5．3　工作原理　182
8．6　创建条形图　184
8．6．1　准备工作　184
8．6．2　开始编程　184
8．6．3　工作原理　186
8．6．4　请参见　187
第9章　井然有序　188
9．1　简介　188
9．2　创建饼图　189
9．2．1　准备阶段　189
9．2．2　开始编程　189
9．2．3　工作原理　192
9．2．4　更多内容　194
9．2．5　请参见　194
9．3　创建堆叠面积图　194
9．3．1　准备阶段　194
9．3．2　开始编程　194
9．3．3　工作原理　196
9．3．4　更多内容　198
9．3．5　请参见　200
9．4　创建矩形式树状结构图　200
9．4．1　准备阶段　201
9．4．2　开始编程　201
9．4．3　工作原理　203
9．4．4　请参见　206
9．5　创建树　206
9．5．1　准备阶段　206
9．5．2　开始编程　206
9．5．3　工作原理　209
9．5．4　请参见　212
9．6　创建封闭图　212
9．6．1　准备阶段　212
9．6．2　开始编程　212
9．6．3　工作原理　214
9．6．4　请参见　216
第10章　可视化交互　217
10．1　简介　217
10．2　与鼠标事件交互　218
10．2．1　准备阶段　218
10．2．2　开始编程　218
10．2．3　工作原理　219
10．2．4　更多内容　220
10．2．5　请参见　221
10．3　多点触摸设备交互　221
10．3．1　准备阶段　221
10．3．2　开始编程　221
10．3．3　工作原理　224
10．3．4　更多内容　225
10．3．5　请参见　226
10．4　实现缩放和平移行为　226
10．4．1　准备阶段　226
10．4．2　开始编程　226
10．4．3　工作原理　228
10．4．4　更多内容　229
10．4．5　请参见　229
10．5　实现拖曳行为　230
10．5．1　准备阶段　230
10．5．2　开始编程　230
10．5．3　工作原理　232
10．5．4　更多内容　233
10．5．5　请参见　233
第11章　使用“原力”！　234
11．1　简介　234
11．2　使用引力和相互作用力　235
11．2．1　准备阶段　235
11．2．2　开始编程　235
11．2．3　工作原理　237
11．2．4　请参见　242
11．3　生成动量　243
11．3．1　准备阶段　243
11．3．2　开始编程　243
11．3．3　工作原理　244
11．3．4　请参见　245
11．4　设置连接约束　246
11．4．1　准备阶段　246
11．4．2　开始编程　246
11．4．3　工作原理　248
11．4．4　请参见　252
11．5　借助力来辅助可视化　252
11．5．1　准备阶段　252
11．5．2　开始编程　252
11．5．3　工作原理　254
11．5．4　请参见　255
11．6　操作“力”　256
11．6．1　准备阶段　256
11．6．2　开始编程　256
11．6．3　工作原理　258
11．6．4　请参见　259
11．7　创建力导向图　259
11．7．1　准备阶段　260
11．7．2　开始编程　260
11．7．3　工作原理　262
11．7．4　请参见　262
第12章　地图的奥秘　263
12．1　简介　263
12．2　美国地图的投影　263
12．2．1　GeoJSON　263
12．2．2　准备阶段　265
12．2．3　开始编程　265
12．2．4　工作原理　266
12．2．5　请参见　268
12．3　世界地图的投射　268
12．3．1　准备阶段　268
12．3．2　开始编程　268
12．3．3　工作原理　270
12．3．4　请参见　270
12．4　构建等值区域图　270
12．4．1　准备阶段　270
12．4．2　开始编程　271
12．4．3　工作原理　272
12．4．4　请参见　272
第13章　测试驱动　274
13．1　简介　274
13．2　下载Jasmine并搭建测试环境　275
13．2．1　准备阶段　275
13．2．2　开始编程　276
13．2．3　工作原理　277
13．2．4　请参见　278
13．3　测试驱动——创建图表　278
13．3．1　开始编程　278
13．3．2　工作原理　279
13．4　测试驱动——SVG渲染　280
13．4．1　开始编程　280
13．4．2　工作原理　281
13．5　测试驱动——精确渲染　282
13．5．1　开始编程　282
13．5．2　工作原理　283
13．5．3　请参见　285
附录：快速创建交互式分析　286
简介　286
Crossfilter．js库　286
开始编程　288
工作原理　289
更多内容　290
请参见　290
多维图表库——dc．js　290
准备阶段　290
开始编程　290
工作原理　292
更多内容　293
请参见　294