使用 svg 繪製長條圖

標籤: svg jQuery javascript

用 svg 搭配 jquery 繪製長條圖,不過要畫長條圖用 D3.js 方便很多,這個之後再弄一篇好了。

先用一個 data 的陣列把資料放進去,然後利用迴圈把資料畫到頁面上,注意要用 jQuery 的話要像這樣寫才能把東西畫到 svg 上,並同時把 attr 設定進去。

$(document.createElementNS(xmlns, "rect"))

完整的程式碼與結果如下: