卡斯伯提供的教學資源:


d3js

D3.js Transition動態效果

先前的資料,都是固定的,沒有任何變化,這次要介紹的是利用資料的轉變以及transition的效果。...

d3js

D3.js 超粘的Voronoi Diagram繪圖

Voronoi Diagram這個繪圖我在Blog的Banner上,主要原因也是因為他很有趣,除了視覺感外,它還包含了簡單的互動。...

d3js

D3.js 圈圈小效果

D3js除了繪製圖表外,還有許多開發者拿來作為視覺或者互動效果,假日的文章,就來介紹一些網路上所找到的效果。...

d3js

D3.js 究竟搭不搭捷運與死亡率有沒有關係?(3) - 將資料繪製成折線圖

有了資料跟一些D3.js基礎後,就可以嘗試把資料轉換成圖,雖然萬事已經具備,但要繪製成圖,還是需要費些心力。...

d3js

D3.js 究竟搭不搭捷運與死亡率有沒有關係?(2) - Google 試算表

上一篇提到資料是放在Google 試算表上,然後再透過web 前端去接資料,當初會想這麼做的原因有以下幾點: 資料路徑穩定,不易掛點 技術上只要成功一次,以後都沒問題 資料建立簡單,大部份的人都可以參與 可以多人協作 對我來說,資料怎麼接一直是很大的問題,也在想如果沒有後端技術,要處理資料是不是...

d3js

D3.js 究竟搭不搭捷運與死亡率有沒有關係?(1)

D3js最終還是需要與資料串接,在玩了一段時間基本的功能後,就會想找點東西試試看,於是就到處搜尋可以用的資料(希望與時事結合),雖然取得資料方法相當多,但是能夠派上用場而且又要會使用,就沒有那麼容易。 因為我的jsonp,或者json能力並不是挺好,所以在找資料前,有先研究怎麼與Google Dri...

d3js

D3.js 折線圖(Line Chart)

在開始有題到網頁互動式資料視覺化:使用D3這本書,整本大致上都看完了,但是裡面居然沒有折線圖!雖然這本書主要教的是觀念,不過折線圖還是很重要,所以還是另外找了折線圖的範例來仔細學習一下。...

d3js

D3.js 軸線(Axis)

到上一次為止,其實就可以畫出簡單的資料圖表,現在開始就要讓資料圖表更為豐富且好閱讀。 今天要介紹的軸線(Axis),讓圖表上多一個可以閱讀的尺標,D3.js正好有提供這樣的函式,可以輕鬆的產出軸線。...

d3js

D3.js 讀取CSV資料並繪製成長條圖

有了Excel的資料,也可以用d3.js去轉換成json,再結合前幾篇所做的長條圖,不就可以輕易的完成資訊圖表了!?是的,這次就來完成這個圖表吧。...

d3js

D3.js 利用Excel建立資料(CSV)

做了那麼多,資料都是隨機產生的,雖然每次打開都不一樣,但是還是假的資料,這次來試試看讀取Excel的資料吧。...

撰寫一篇文章需要花上非常多的時間,如果你關閉 Adblock (廣告阻擋器),我會非常的開心 🤗。 (╭(°A°`)╮))
撰寫一篇文章需要花上非常多的時間,如果你關閉 Adblock (廣告阻擋器),我會非常的開心 🤗。 (╭(°A°`)╮))