因為需要所以開始了，D3.js的學習之路。 在開始學的時候，發現的學習D3.js需要有一些SVG和canvas的知識，這些是我之前都沒有接觸過的，所以現在從svg開始學習了。 SVG可縮放矢量圖，使用XML格式SVG文件必須使用.svg后綴來保存。先來一個例子： SVG 代碼 ...

目標 　　在這一章，我們將會重溫SVG圖形，學習如何使用D3.js來創建這些圖形。 　　這里會包括前面例子中的SVG基礎圖形以及如何使用D3.js設置圖形的屬性。 使用D3.js畫一個SVG 的 圓 circle 　　可以使用如下代碼創建： <svg width="50 ...

Scalable Vector Graphics 是一個成熟的W3C標准，被設計用來在web和移動平台 上展示可交互的圖形。和HTML類似，SVG也支持CSS和JavaScript。盡管可以使用 HTML展示數據，SVG才是數據可視化領域的事實標准。 我們在右邊的示例中，簡短回顧一下SVG的常用 ...

目標 　　在這一章，你將要使用D3.js基於一些數據把SVG元素添加到你想要的坐標位置上。 　　我們的目標就是使用下面的數據集： 　　並使用D3.js來對這些數據進行可視化： 數學/圖形 坐標空間(Mathematical/Graph Coordinate Space ...

D3的坐標軸組件會自動顯示刻度的參考線。這可以讓你只專注於數據的顯示，而讓坐標軸組件去幫你繪制坐標軸和標記刻度。 Axis D3的軸組件是為D3的quantitative, time 和 ordinal 標度所設計的。 # d3.svg.axis() 新建 ...

目標 　　在這一章，你將會使用D3.js，基於我們的數據來把SVG元素添加到網頁中。這一過程包括：把數據綁定到元素上，然后在使用這些元素來可視化我們的數據。 　　注意：不同於前幾章，我們從一個完整的代碼開始，然后去一步步理解它，從這一章開始，我們將會從零開始構建我們的數據可視化 ...

D3.js 是操作基於數據文件的JavaScript庫。它使用HTML、SVG和CSS讓你的數據基情四射。D3在web標准上着重為你提供現代瀏覽器的全部功能，而且不需要通過使用你自己專門的框架、結合強大的可視化組件和DOM操作的數據驅動方法。 點擊下載最新版（3.5.5）： d ...

上一節我們已經學習了如何設置填充區域，其實理解了他的實現原理還是非常簡單了。這一節中， 我們主要學習多條曲線的繪制，以及給不同的曲線指定不同的縱坐標。 新的數據 由於我們要畫兩條曲線，所以我 ...