AI時代在網頁上資料視覺化：D3.js實作寶典

大數據時代資料視覺化神器的最佳選擇
在大數據蓬勃發展的時代，每天都有驚人的資料量產生，分析出有用的資訊固然重要， 然而， 資料分析所得出的結論，要如何「明確、有效」的予以呈現，其重要性並不亞於資料分析，因此，「資料視覺化」應運而生。
資料視覺化可以視為一門「述說」資料的藝術，它透過一系列的圖表對使用者傳遞某種資訊。而在網路時代，傳播最快速的方式非瀏覽器與網頁莫屬，因此，以網頁為基礎的視覺化專案如雨後春筍般地出現。
D3在Github上擁有極大的關注數，曾高居第二位。夾帶著龐大使用者的氣勢，D3在許多國家和地區被稱為資料視覺化的代名詞。
適用：大數據分析相關從業人員；對資料視覺化有興趣者。

✤執行環境
執行本書的範例，需要安裝以下軟體：
Chrome、Firefox、Safari、Opera、Internet Explorer 9及更新版本；
Apache HTTP Server或Ngnix等伺服器軟體（部分範例）。
✤排版約定
為讓讀者把握重點，本書將採用以下排版約定。
（1）正文中重要的詞彙會使用粗體字型以示強調。
（2）重要的程式會以粗體字型表示強調，例如：
d3.selectAll("p").text("cat"); //普通程式
d3.selectAll("p").text("dog"); //重要程式
✤勘誤資訊
一本書要想增強，需要許多讀者回饋錯誤。筆者雖想盡最大努力確保沒有錯誤，但卻是困難的。如果發現書中的任何錯誤，小到錯別字，大到程式無法執行等，希望能及時回饋。您的任何一次勘誤，都會令筆者和其他讀者受益。
與本書相關的最新動態請造訪以下網站：
http://www.decembercafe.org/
勘誤資訊請發送郵件至：
phantomtyry@126.com

前　言
D3（Data-Driven Documents）是一個用於資料視覺化開發的JavaScript函數庫，專案託管於GitHub。GitHub是全世界最流行的程式託管平台，雲集了來自世界各地的優秀工程師。D3自誕生以來，不斷受到好評，其排名在GitHub的專案倉庫排行榜已高居第2位（2017年3月）。以一個視覺化工具而言，能取得這種成就可說是奇蹟。
人數多並不表示一個工具好，但一定表示它擁有更多的教學、範例程式、社區問答和出版物。D3由於其龐大的使用者量，已經幾乎成為資料視覺化的代名詞。
本書希望盡可能讓零基礎初學者也能閱讀，但或許很難。您也許需要至少掌握一種程式語言，例如C/C++、Java、JavaScript，了解網頁撰寫的基礎。
學習本書後，相信讀者能在一邊查詢API的情況下完成資料視覺化的工作。為使閱讀儘量簡單、容易，本書附帶非常豐富的插圖。
用圖而不用文字。這也正好符合視覺化的追求。

✤致謝
感謝我的妻子，當我感到疲勞時，有她在身邊總能感到安心。
感謝我的兒子，他是我最重要的精神支柱。
感謝本書的編輯付睿女士，她協助我完成本書的構思，並提出了很多建設性的意見。

前 言
Chpater 01 D3簡介
1.1 D3是什麼
1.2 資料視覺化是什麼
1.3 圖表種類
1.4 學習方法
Chpater 02 Web前端開發基礎
2.1 瀏覽器和伺服器
2.2 HTML&CSS
2.3 JavaScript
2.4 DOM
2.5 SVG
2.6 Canvas
2.7 色彩基礎
Chpater 03 準備開發環境
3.1 下載D3
3.2 安裝Chrome和Sublime Text
3.3 安裝Apache HTTP Server
3.4 Hello World
3.5 繪製向量圖
3.6 偵錯
Chpater 04 D3基礎：選擇集與資料
4.1 選擇元素
4.2 選擇集
4.3 增加、插入和刪除
4.4 資料綁定
4.5 update、enter、exit
4.6 選擇集的常用方法
4.7 陣列的常用方法
4.8 直條圖
Chpater 05 比例尺和座標軸
5.1 定量比例尺
5.2 序數比例尺
5.3 座標軸
5.4 散點圖
Chpater 06 繪製
6.1 顏色
6.2 線段產生器
6.3 區域產生器
6.4 弧產生器
6.5 符號產生器
6.6 弦產生器
6.7 對角線產生器
6.8 聚合線圖
Chpater 07 動畫
7.1 過渡效果
7.2 散點圖的過渡效果
Chpater 08 互動
8.1 監聽器
8.2 事件d3.event
8.3 行為d3.behavior
Chpater 09 匯入和匯出
9.1 檔案匯入
9.2 檔案匯出
Chpater 10 版面配置
10.1 圓形圖
10.2 力導向圖
10.3 弦圖
10.4 樹狀圖
10.5 捆圖
10.6 長條圖
10.7 矩陣樹狀圖
Chpater 11 地圖的基礎
11.1 地圖的資料
11.2 中國地圖
11.3 地理路徑
11.4 投影
Chpater 12 人性化的互動
12.1 提示框
12.2 座標系中的焦點
12.3 元素組合
12.4 區域選擇
12.5 開關
Chpater 13 地圖的應用
13.1 值域的顏色
13.2 標記
13.3 標線
13.4 滑動和縮放
13.5 力導向地圖
Chpater 14 D3 4.x簡介
14.1 4.x的新功能
14.2 3.x如何升級到4.x
14.3 D3 4.x的設計思想
14.4 未來展望
Chpater 15 D3 4.x新功能剖析
15.1 全新的力導向圖
15.2 豐富多彩的色票面板
15.3 功能倍增的圖形產生器
15.4 更合理的版面配置
15.5 無限循環的過渡效果
Chpater 16 D3 4.x在地圖上的應用
16.1 Canvas 地圖的基本功能
16.2 地圖上飛舞的流星
16.3 地球儀
16.4 結合Leaflet.js和D3.js
參考文獻