系列文章
Day11-React環境架設(Webpack)
前言 今天要來介紹如何手動建立 React.js 的開發環境，今天要介紹的東西需要對 Webpack 有點基礎知識，由於 Webpack 的基本觀念非常多因此筆...
Day12-D3基本介紹(作用、svg)
前言 從今天開始到結束的文章沒意外都會講 D3.js 了，前端能做資料視覺化的套件非常多，只是筆者覺得在用其他比較方便的套件之前應該要先了解整個圖表繪製過程，而...
Day13-D3基本介紹(scale、range)
前言 今天要來介紹 D3.js 中第一個重要觀念： scale 以及 range ，在 D3.js 中的每個圖表都必須要設定 scale 以及 range ，今...
Day14-D3基本介紹(domain、endpoint)
前言 昨天講了跟輸出區域有關的 scale 以及 range ，今天要來談一下輸入區域的 domain 了，這裡筆者會多提一個 endpoint ，其實這個 e...
Day15-D3基本介紹(time format)
前言 今天要來介紹一個蠻重要的技巧，一般來說 JS 用來處理時間的套件相信大家首選都是 Moment.js ，當然筆者也是一樣，不過今天筆者並沒有要介紹 Mom...
Day16-D3基本介紹(number format)
前言 今天的文章跟昨天的內容基本上差不多，今天要來講講 D3 是如何處理數字格式，其實數字是不需要經由 D3 去轉換也可以直接使用 d3.scaleLinear...
Day17-D3基本介紹(select、append、attr)
前言 從今天開始的文章就正式進入 D3 的圖表繪製設定了，光最基本的輸入輸出區域就花了不少篇幅說明 (其實是為了拖台錢讓鐵人賽更容易完賽XD) ，總之接下來的文...
Day18-D3基本介紹(data)
前言 在昨天的文章講完如何先初始化一個 svg 容器來填入圖表後，今天要來介紹如何把資料傳進去 svg 內進行圖表繪製嘍！ selectAll 昨天介紹了 d3...
Day19-D3基本介紹(Axis)
前言 在昨天的文章講完如何傳資料進去圖表後，今天要來介紹另一個重要的觀念： Axis 了，其實 Axis 代表的就是座標軸上的設定，透過客製化調整 Axis 的...
Day20-D3基本介紹(chart event、tooltip)
前言 在講完所有的圖表設定後，今天要來介紹如何讓我們設計好的圖表可以跟使用者進行互動，為了要讓圖表能進行互動我們就必須要將圖表設定一些 event ，這樣使用者...