第Ⅰ部分 数据可视化之美 3
第1章 数据可视化的世界 3
1.1 将数字带入生活中 3
1.1.1 采集数据 4
1.1.2 可视化数据 4
1.1.3 同时采集和可视化数据 5
1.2 数据可视化的应用 6
1.2.1 在公共部门中的应用 7
1.2.2 在B2B和企业内部的应用 7
1.2.3 B2C的使用 8
1.3 Web专业人士:一直参与其中 9
1.4 可用的技术 10
1.4.1 更快和更优秀的JavaScript处理 10
1.4.2 HTML5的崛起 11
1.4.3 降低实现门槛 12
1.5 小结 13
第2章 分析的基本要点 15
2.1 关键的分析概念 15
2.1.1 平均数和中位数 16
2.1.2 标准偏差 16
2.2 使用采样数据 18
2.2.1 标准偏差变异 18
2.2.2 人均计算 18
2.2.3 误差幅度 19
2.3 使用数据挖掘检测模式 19
2.4 预测未来趋势 20
2.5 小结 22
第3章 构建可视化基础 23
3.1 探索可视化数据的范围 23
3.1.1 图表图元 24
3.1.2 浏览高级可视化 35
3.1.3 蜡烛图 35
3.1.4 气泡图 36
3.1.5 曲面图 37
3.1.6 地图 38
3.1.7 信息图 39
3.2 使用HTML5 Canvas 41
3.3 集成SVG 43
3.4 小结 45
第Ⅱ部分 使用JavaScript进行分析 49
第4章 集成现有数据 49
4.1 从标准文本文件中读取数据 49
4.1.1 异步工作 50
4.1.2 读取CSV文件 50
4.2 使用XML数据 52
4.2.1 了解XML格式 52
4.2.2 获得XML数据 53
4.2.3 使用XSLT设计样式 55
4.3 显示JSON内容 57
4.3.1 了解JSON语法 57
4.3.2 读取JSON数据 58
4.3.3 异步JSON 59
4.4 小结 62
第5章 以交互方式收集数据 63
5.1 使用HTML5表单控件 63
5.1.1 引入HTML5输入类型 63
5.1.2 表单部件和数据格式化 64
5.2 最大化移动表单 65
5.2.1 使用上下文键盘 65
5.2.2 样式化移动表单增加可用性 66
5.2.3 移动表单部件 66
5.3 小结 66
第6章 验证数据 69
6.1 服务器端验证和客户端验证 70
6.2 原生HTML5验证 70
6.2.1 原生验证和JavaScript验证 71
6.2.2 了解HTML5验证 71
6.2.3 使用HTML5验证数字 72
6.2.4 必需的字段和最大长度 72
6.2.5 自定义HTML5验证规则 73
6.2.6 自定义HTML5验证消息 73
6.2.7 h5Validate polyfill 74
6.3 jQuery验证引擎 74
6.3.1 了解jQuery验证引擎 75
6.3.2 验证器 75
6.3.3 错误消息 79
6.4 小结 80
第7章 检查和排序数据表 81
7.1 输出基本的表格数据 82
7.1.1 构建表格 82
7.1.2 使用语义表格标记 84
7.1.3 为表格添加标签 88
7.1.4 配置列 89
7.2 确保最大可读性 92
7.2.1 设计表格 93
7.2.2 增加可读性 96
7.2.3 添加动态高亮效果 102
7.3 包含计算 104
7.3.1 使用JavaScript执行计算 108
7.3.2 填充表格 111
7.4 使用DataTables库 112
7.4.1 使用DataTables制作美观的表格 113
7.4.2 使用DataTables排序 116
7.4.3 使用DataTables创建计算列 118
7.5 将数据表关联到图表 120
7.6 小结 132
第8章 在客户端执行统计分析 133
8.1 使用jStat执行统计分析 133
8.1.1 开始使用jStat 134
8.1.2 初步使用Stat 135
8.2 使用Flot渲染概率分布图 136
8.2.1 开始使用Flot 136
8.2.2 渲染正态分布曲线 138
8.3 小结 140
第Ⅲ部分 以编程的方式可视化数据 143
第9章 浏览绘图工具 143
9.1 创建HTML5画布图表 144
9.1.1 HTML5 画布基础知识 144
9.1.2 线性插值 145
9.1.3 简单柱状图 146
9.1.4 实现坐标轴 161
9.1.5 添加动画 169
9.2 使用Google Charts 180
9.2.1 Google Charts API 基础知识 180
9.2.2 基本的条形图 181
9.2.3 基本的饼状图 182
9.2.4 使用图表动画 184
9.3 小结 187
第10章 使用Rapha?l构建自定义图表 189
10.1 介绍Rapha?l 190
10.1.1 SVG和画布图表 190
10.1.2 开始使用Rapha?l 190
10.1.3 绘制路径 191
10.1.4 将自定义图形导入到Rapha?l中 192
10.1.5 创建Rapha?l图形动画 194
10.1.6 使用Rapha?l处理鼠标事件 194
10.2 使用gRapha?l 195
10.2.1 创建饼状图 195
10.2.2 创建线形图 196
10.2.3 创建条形图和柱状图 199
10.3 扩展Rapha?l来创建自定义图表 201
10.3.1 创建通用模式 202
10.3.2 绘制弧形 203
10.3.3 将数据处理成可用的值 207
10.3.4 添加鼠标交互性 211
10.3.5 为数据添加标签 213
10.3.6 结束示例 215
10.4 小结 219
第11章 D3简介 221
11.1 开始学习 223
11.1.1 DOM和SVG 224
11.1.2.select 224
11.1.3.selectAll 225
11.1.4.data(又称数据连接) 227
11.1.5 键函数 236
11.1.6.transition 238
11.1.7 对象不变 240
11.1.8 嵌套选择 242
11.2 D3帮助函数 244
11.2.1 绘制线条 244
11.2.2 缩放 246
11.3 D3帮助布局 248
11.4 小结 251
第12章 使用符号 253
12.1 通过D3使用SVG符号 254
12.1.1 创建D3线形表 254
12.1.2 在线形表中添加符号 259
12.1.3 使符号变得可交互 260
12.2 通过Ignite UI igDataChart使用画布符号 264
12.2.1 使用Ignite UI igDataChart创建线形图 264
12.2.2 为图表添加符号 269
12.2.3 创建气泡图 272
12.3 小结 276
第13章 映射全局、区域和局部数据 277
13.1 使用Google Maps 278
13.1.1 映射可视化的基础知识 278
13.1.2 Google MapsAPI v3 279
13.2 使用标记自定义地图 282
13.2.1 显示地图标记 283
13.2.2 准备将要绘制在地图上的数据 284
13.2.3 使用标记绘制点数据 288
13.2.4 使用标记区域绘制一个额外的统计信息 291
13.2.5 使用热度地图显示数据密度 295
13.3 在分级统计图中绘制数据 298
13.3.1 获取几何图形绘制在地图上 299
13.3.2 使用Topojson转换几何图形用于显示 300
13.3.3 使用D3渲染地图几何图形 301
13.3.4 使用分级统计地图显示统计信息 303
13.4 小结 310
第14章 使用Ignite UI igDataChart绘制时间系列 311
14.1 使用股票数据 312
14.1.1 股票数据基础知识 312
14.1.2 获取一些股票数据 313
14.1.3 蜡烛图和OHLC(收市价图) 313
14.2 实现Ignite UI igDataChart 315
14.2.1 获取Ignite UI 316
14.2.2 使用igDataChart实现股票图 316
14.2.3 为图表添加缩放栏 325
14.2.4 添加同步图表 327
14.2.5 使用技术分析工具 329
14.3 绘制实时数据 330
14.3.1 创建一个节点推送数据服务 331
14.3.2 在客户端接收更新 335
14.3.3 浏览更新渲染技术 341
14.4 绘制海量数据 343
14.5 小结 348
第Ⅳ部分 交互式分析和可视化项目 351
第15章 构建一个内部相互连接的仪表盘 351
15.1 美国人口普查API 352
15.2 渲染图表 353
15.2.1 性别图表 353
15.2.2 种族图表 355
15.2.3 家庭规模图表 357
15.2.4 家庭不动产占有图表 358
15.2.5 年龄性别图表 359
15.2.6 人口历史图表 364
15.3 创建仪表盘 366
15.3.1 基本标记和样式 366
15.3.2 响应层 369
15.4 使用Backbone连接组件 370
15.4.1 创建模型和集合 371
15.4.2 将图表标记转换成JavaScript模板 372
15.4.3 创建州下拉菜单 374
15.4.4 渲染州的变化 376
15.5 下一步 392
15.5.1 在重置大小时重新渲染 392
15.5.2 其他改进 392
15.6 小结 392
第16章 D3实践 395
16.1 使D3看起来更完美 396
16.1.1 内嵌样式与CSS 396
16.1.2 外边距 396
16.1.3 排序 397
16.1.4 指针事件 398
16.1.5 清晰边缘 398
16.2 使用坐标轴 399
16.3 使用Voronoi地图 403
16.3.1 基本的Voronoi地图 403
16.3.2 Voronoi点选择 406
16.4 制作可重用的可视化 409
16.5 小结 416