內容簡介
用JavaScript動態呈現數據
超越設計概念,藉助現代JavaScript和jQuery的強大功能和靈活性,生動直觀地分析和呈現數據!《數據分析與呈現——使用JavaScript&jQuery》循序漸進地講解將數字融入生活的關鍵技術和工具,並列舉緊貼實用的示例來演示如何在實際套用中使用這些技能。通過閱讀本書,將可以深入學習JavaScript和jQuery核心庫,識別數據透露的信息,並以較低成本創建可視化圖表。配書網站包含所有示例代碼、數據集以及庫和其他資源的連結。
主要內容
◆ 指導你使用自己首選的Web程式語言創建卓越的可視化圖表
◆ 提供用於分析和可視化的JavaScript和jQuery核心庫的詳情
◆ 分析各種可視化方法和技術
◆ 演示如何用JavaScript分析和操縱數據
◆ 提供構建特定數據可視化類型所需的詳明分步指令
◆ 介紹繪製圖表的技術,講解如何創建和自定義地圖以及如何使用D3和IgniteUI
◆ 展示如何執行互動式分析以及如何開發可視化項目
目錄
第Ⅰ部分數據可視化之美
第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.3B2C的使用 8
1.3Web專業人士:一直參與其中 9
1.4可用的技術 10
1.4.1更快和更優秀的JavaScript處理 10
1.4.2HTML5的崛起 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使用HTML5Canvas 41
3.3集成SVG 43
3.4小結 45
第Ⅱ部分使用JavaScript進行分析
第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.7h5Validatepolyfill 74
6.3jQuery驗證引擎 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
第Ⅲ部分以編程的方式可視化數據
第9章瀏覽繪圖工具 143
9.1創建HTML5畫布圖表 144
9.1.1HTML5畫布基礎知識 144
9.1.2線性插值 145
9.1.3簡單柱狀圖 146
9.1.4實現坐標軸 161
9.1.5添加動畫 169
9.2使用GoogleCharts 180
9.2.1GoogleChartsAPI基礎知識 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.1SVG和畫布圖表 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.1DOM和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.2D3幫助函式 244
11.2.1繪製線條 244
11.2.2縮放 246
11.3D3幫助布局 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通過IgniteUIigDataChart使用畫布符號 264
12.2.1使用IgniteUIigDataChart創建線形圖 264
12.2.2為圖表添加符號 269
12.2.3創建氣泡圖 272
12.3小結 276
第13章映射全局、區域和局部數據 277
13.1使用GoogleMaps 278
13.1.1映射可視化的基礎知識 278
13.1.2GoogleMapsAPIv3 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章使用IgniteUIigDataChart繪製時間系列 311
14.1使用股票數據 312
14.1.1股票數據基礎知識 312
14.1.2獲取一些股票數據 313
14.1.3蠟燭圖和OHLC(收市價圖) 313
14.2實現IgniteUIigDataChart 315
14.2.1獲取IgniteUI 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
第Ⅳ部分互動式分析和可視化項目
第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.2Voronoi點選擇 406
16.4製作可重用的可視化 409
16.5小結 416