教學

影片

D3.js、C3.js 資料視覺化教學

官網

D3.js - Data-Driven Documents

C3.js | D3-based reusable chart library

漸層色

Bar graph colors based on value in c3.js

影片筆記整理

• 一個web應用程式會接很多服務，例如D3.js是視覺化服務，提供圖形化套件及框架，可將不只一個opendata轉為JSON後放入D3.js
• D3.JS 是操控 SVG 向量圖形的視覺化框架，而 C3.JS 則是仰賴於 D3.js 為核心所設計的圖形報表框架
• Canvas = 多用在3D，像素渲染，放大會模糊。ex. WebGL

A-Frame - Make WebVR

• SVG = 2D，向量圖片。
• 做遊戲時Canvas和SVG效能是div的10倍
• d3.js是目前最好的SVG框架
• 取得資料 → 處理資料 → 到入圖表

D3.js - SVG介紹

JS Bin

SVG介紹

D3辭典