TOOLS
用JavaScript Charting API做圖表

JavasScript Charting API

在網頁上表示圖表,除了用圖片外,也可以用JavaScript Charting API,方便簡單漂亮,大多數Browser都支援。以下介紹幾個我喜歡的API,並以小妹日常Schedule作為數據作示範 XD。

今次介紹的API

  1. FusionCharts
  2. D3.js
  3. Chartist,js

1. FusionCharts

FusionCharts
兩年前第一次用JavaScript做圖表,用的就是FusionCharts,覺得好強大,甚麼類型Chart都有。有付費版、試用版和免費版。試用版有Watermark,個人網頁並不含商業用途的話,也可用無Watermark的免費版。

D3.js

D3.js
Open Source,用HTML、SVG和CSS出圖。不Support IE8。

3. Chartist.js

Chartist
用SVG出圖,不Support IE8。Responsive Chart。官網太可愛了,所以我好喜歡。

heika的一天

以下用FusionCharts做,因為真的好易用又靚,差在有Watermark。(沒有付錢的人)

FusionCharts XT will load here!

可見完全是上班下班一天就完了。

總結

如果只是要Render簡單的Chart的話,應該大多數Charting API都可以,選個自己合眼緣的就可XD。

更多Charting API介紹: The 15 Best JavaScript Charting Libraries
用Pie Chart來做Schedule起源: ぱくたそ管理人の1日!タイムスケジュール(円グラフ風)を作ってみました。皆さんもどうぞ。

One thought on “用JavaScript Charting API做圖表

  • I am going to guess it’s Rachel guest hosting the blog today. I would love to have a copy of the ebook and ecstatic to have a hard copy of the book. Thanks for the opprtounity!

  • Leave a Reply

    Your email address will not be published.

    You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">