今天要向大家推薦9款很棒的可在網頁中繪製圖表的JavaScript指令碼,這些有趣的JS指令碼可以協助你快速方便的繪製圖表(線、面、餅、條…),其中包括jQuery、MooTools、Prototype和一些其它的JavaScript架構。
您還可以參考以下JavaScript/CSS相關教程及資源:
《精選30個優秀的CSS技術和執行個體》
《300+Jquery, CSS, MooTools 和 JS的導覽功能表資源》
1.Flot
Flot是基於 jQuery架構繪製圖表的純Javascript架構。它可在用戶端即時繪製並產生各種圖形。重要的是它使用簡便(還有很多可選的設定)、迷人的視覺效果和互動功能,表縮放和滑鼠跟蹤等。該javascript架構適用於我們所熟知的 Internet Explorer 6/7/8, Firefox 2.x+, Safari 3.0+, Opera 9.5+ and Konqueror 4.x+瀏覽器。 查看圖表範例
2.JS Charts
JS Chart是需要一些簡單或無需手工書寫編碼的基於Javascript的免費圖表產生器。使用JS Chart可以很簡單很容易的完成你的組建圖表任務,因為你只需要使用用戶端指令碼(即瀏覽器端),無需多餘的外掛程式或伺服器端模組。你只需要準備好JS Chart指令碼、包含圖表資料的XML或Javascript數組,你的圖表就準備就緒了。
3. TableToChart
TableToChart 是基於MooTools JS架構的網頁圖表產生器,它通過包含在HTML table中的值來繪製圖形圖表。您可以使用Table標籤來組建圖表,條、線和餅都可以。
4.PlotKit
PlotKit是一款繪製圖表圖形的Javascript架構。它支援HTML Canvas、基於Adobe SVG Viewer的SVG和本地瀏覽器。
5. Yahoo UI Charts Control
YUI圖表管理可以在網頁中以垂直條、橫條、線、餅等形式可視化呈現圖表。主要特色包括支援DataSource、滑鼠移至上方資料提示、組合圖和皮膚功能。
6. ProtoChart
ProtoChart是基於Prototype和Canvas可建立非常漂亮圖表的開源架構。它支援線、條、餅、曲線、混雜(mix)、面圖表等多種資料串聯在統一圖形中。它支援IE6/7, FF2/3 和 Safari 甚至可以在 iPhone上工作.
7. EJSChart
EJSChart支援滑鼠跟蹤、滑鼠事件、鍵盤跟蹤和事件、縮放、滾動、十字線增加互動感並為網頁圖表的使用者體驗提升了一個檔次。您可以選擇多種圖表類型:線、面、分散資料、餅和函數級數。圖表的每個細節都可以自定製。
8.fgCharting
fgCharting是基於jQuery架構的簡便圖表產生器,它也支援各種圖表類型並可以自訂參數。
9. 純Css資料圖表
純CSS代碼實現的圖表,怎麼樣,難以置信吧,想知道如何?的嗎?那就來看看這篇純CSS製作圖表的教程吧。
英文原文:Useful scripts to plot charts in web pages
翻譯原文:推薦9款很棒的可在網頁中繪製圖表的JavaScript指令碼