鐵人檔案
是不是覺得用D3.js 畫圖表很酷炫但也很難學呢？想好好學卻發現官方文件看不懂嗎？網路上別人教學的程式碼搬過來卻跑不動嗎？版本變化太快，找不到最新版的教學嗎？現在不用擔心了，這系列通通幫你解決！
本系列使用目前D3.js最新版v7，並從最基礎的D3核心概念開始講解。帶大家了解DOM、JS Event、CSS selection、SVG的原理，以及D3.js 選取與資料綁定的核心；接著一路帶到 D3.js 繁多如麻的API講解，以及要如何看懂官方文件去找到 API 的使用方法；最後則把常見的圖表全帶大家手把手寫一次，並加上圖表動畫~讓你之後畫圖表不求人！
本篇大綱：click、hover、mouseover、mousemove 由於 D3.js 是操作DOM元素去建構圖表，因此DOM元素能使用的觸發事件，D3...
本篇大綱：tooltips 基礎設定、tooltips 進階應用 今天我們要來講解算是D3最輕鬆簡單的 tooltips 啦！其實所謂的tooltips就是...
本篇大綱：selection.call( )、drag.on( )、範例 今天要來看另一個d3有趣的互動事件：Drag 拖曳！ 我們先來看看官方文件關於 d...
本篇大綱：Force 原理、引力與斥力、五種作用力、Force的 API 們、六種應用範例 今天要來講講 Force 原力～這是我認為D3中數一數二困難的圖...
本篇大綱：d3.zoom( )、zoom 旗下的API、範例 上一篇看完讓人燒腦的Force之後，我們這次來看看 D3 另一個有趣的特效：Zoom 縮放～它...
本篇大綱：d3.brush( )、brush 的 API 們、範例 今天我們要來看本系列的最後一個互動效果，那就是 — Brush 刷子啦！Brush 的功...
本篇大綱：Domain & Range 輸入域與輸出域、Interpolate 插補值、continuous & discrete 連續性與離...
本篇大綱：軸線的組成、建立軸線的必備工具、繪製軸線的API、ticks 刻度、XY 軸範例 講了好久終於進到軸線與刻度了！！！前面的章節看完比例尺之後，接下...
本篇大綱：window.resize、RWD 圖表、軸線刻度數量隨畫面變化增減 前兩篇看完比例尺跟軸線後，現在D3的知識拼圖就只差最後這塊啦！今天我們要學的...
本篇大綱：選擇最合適的圖表、圓餅圖、本次範例的畫面與互動效果、pie( ) 與 arc( )、繪製圓餅圖 終於要正式進到一天一張圖的篇章了！在開始繪製圖表之...
