1、線性比例尺 d3.scale.linear() 創建一個線性比例尺 .domain([0,500]) 定義域 .range([0,1000]) 值域 linear(x) 輸入定義域 返回 值域 ...

入門好文：http://www.ourd3js.com/wordpress/?p=51 d3.js和d3.min.js內容一樣，后者是壓縮過的，適合發行版本，前者適合開發人員。 1.選擇集(滿足css選擇符的要求)主要和數據綁定一起使用 d3.select() d ...

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

從今天開始我將和大家一起學習D3.js（Data-Driven Documents），由於國內關於D3的學習資料少之又少，所以我覺得很有必要把自己學習過程記錄下來，供同學們參考，如果文章有有哪些表達有錯誤的還希望同學們幫我指出來。當然了， 可以的話我希望大家都可以去看看英文資料（文章后面將列英文 ...

上一節我們已經學習了線條樣式和格柵的繪制，在這一節中我們將要根據之前繪制的線條對圖表進行填充，首先來看一下我們的目標吧 在這個圖表中，我們對位於線條下面的空間進行了填充，那么，如何改做到呢？ 設置填充樣式 這里設置我們填充區域的樣式，我們使用淺藍色進行填充： .area ...

上節我們學習了如何繪制多條曲線， 以及給不同的曲線指定不同的坐標系。在這節當中，我們會對坐標軸標簽相關的處理進行學習。首先，我們來想一個問題， 如何我們的x軸上的各個標簽的距離比較近，但是標簽名又比較長怎么辦？ 像是下面這種情況該如何處理？ 上圖中x軸上的標簽是不是都重疊在一起了？非常惡心對不對 ...

上一節中我們學會了如何旋轉x軸標簽以及自定義標簽內容，在這一節中，我們將接觸動畫（transition） 首先，我們要在頁面上添加一個按鈕，當我們點擊這個按鈕時，調用我們的動畫。所以，我們還需要在原來的基礎上添加兩個東西。 添加一個按鈕 <div id="option"> ...

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