EChart.js 簡單入門
最近有一個統計的項目要做，在前端的資料需要用圖表的形式展示。網上搜尋了一下，發現有幾種統計圖庫。
MSChart
這個是Visual Studio裡的自帶控件，使用比較簡單，不過資料這塊需要在背景綁定。
ichartjs
是一款基于HTML5的圖形庫。使用純javascript語言, 利用HTML5的canvas标簽繪制各式圖形。 支援餅圖、環形圖、折線圖、面積圖、柱形圖、條形圖等。
Chart.js
也是一款基于HTML5的圖形庫和ichartjs整體類似。不過Chart.js的教程文檔沒有ichartjs的詳細。不過感覺在對于移動的适配上感覺比ichartjs要好一點。
ECharts.js
這是我準備在這個項目中使用的圖形庫，這也是一款基于HTML5的圖形庫。圖形的建立也比較簡單，直接引用Javascript即可。使用這個庫的原因主要有三點，一個是因為這個庫是百度的項目，而且一直有更新，目前最新的是EChart 3；第二個是這個庫的項目文檔比較詳細，每個點都說明的比較清楚，而且是中文的，了解比較容易；第三點是這個庫支援的圖形很豐富，并且可以直接切換圖形，使用起來很友善。
官網：ECharts.js
下面來簡單說明一下EChart.js的使用。
js檔案有幾個版本，可以根據實際需要引用需要的版本。下載下傳連結
這樣簡單的一個統計圖表就出來了，官網使用的柱狀圖，我這邊改用了折線圖。
柱狀圖其實也很簡單，隻要修改一個參數就可以了。把series裡的type 值修改為"bar"
餅圖和折線圖、柱狀圖有一點差別。主要是在參數和資料綁定上。餅圖沒有X軸和Y軸的坐标，資料綁定上也是采用value 和name對應的形式。
、