轉(zhuǎn) http://m.tkk7.com/Unmi/articles/260197.html
jQuery, MooTools, Prototype 等優(yōu)秀的 JavaScript 框架擁有各種強(qiáng)大的功能,包括繪制 Web
圖表,使用這些框架以及相應(yīng)插件,我們可以非常輕松地實(shí)現(xiàn)曲線圖,圓餅圖,柱狀圖等 Web 圖表的繪制,而不必象以往那樣通過(guò)復(fù)雜的 Flash
技術(shù)實(shí)現(xiàn)。
本文介紹了9個(gè)優(yōu)秀的基于 JavaScript 與 CSS 的 Web 圖表框架。
jQuery,
MooTools, Prototype 等優(yōu)秀的 JavaScript 框架擁有各種強(qiáng)大的功能,包括繪制 Web
圖表,使用這些框架以及相應(yīng)插件,我們可以非常輕松地實(shí)現(xiàn)曲線圖,圓餅圖,柱狀圖等 Web 圖表的繪制,而不必象以往那樣通過(guò)復(fù)雜的 Flash
技術(shù)實(shí)現(xiàn)。本文介紹了9個(gè)優(yōu)秀的基于 JavaScript 與 CSS 的 Web 圖表框架。
1. Flot

Flot
是一個(gè)純粹的 jQuery JavaScript
繪圖庫(kù),可以在客戶端即時(shí)生成圖形,使用非常簡(jiǎn)單,支持放大縮小以及鼠標(biāo)追蹤等交互功能。該插件支持 IE6/7/8, Firefox 2.x+,
Safari 3.0+, Opera 9.5+ 以及 Konqueror 4.x+。使用的是 Safari 最先引入的 Canvas
對(duì)象,目前所有主流瀏覽器都支持該對(duì)象,除了 IE, 因此在 IE中使用 JavaScript 進(jìn)行模擬。這里有一些實(shí)例。
2. JS Charts

JS Charts 是一個(gè)免費(fèi)的基于 JavaScript 的圖表生成器,表格繪制非常簡(jiǎn)單,幾乎不需要編碼,也不需要插件和服務(wù)器模塊,使用XML 或 JavaScript 數(shù)組緩存數(shù)據(jù)。
3. TableToChart
TableToChart 是一個(gè) MooTools 腳本,可以將 HTML Table 對(duì)象中存儲(chǔ)的數(shù)據(jù)繪制成圖表。你可以使用 table 標(biāo)簽生成圖表,柱狀圖,曲線圖,圓餅圖等。
4. PlotKit
PlotKit 是一個(gè) JavaScript 繪圖庫(kù),支持 HTML Canvas 標(biāo)簽,也支持 SVG。
5. Yahoo UI Charts Control

YUI Charts Control 可以在網(wǎng)頁(yè)上將表格數(shù)據(jù)轉(zhuǎn)換為圖表,支持柱狀圖,曲線圖以及圓餅圖。支持 DataSource 工具,可設(shè)置的軸,鼠標(biāo)盤(pán)旋提示,圖表組合,以及皮膚等功能。
6. ProtoChart

ProtoChart
是一個(gè)基于 Prototype 和 Canvas 標(biāo)簽的開(kāi)源庫(kù),這個(gè)庫(kù)深受 Flot, Flotr, Plotkit
等啟發(fā),支持曲線圖,柱狀圖,圓餅圖等,可以在同一個(gè)圖表上顯示多套數(shù)據(jù),支持可定制的圖例,網(wǎng)格,邊界以及背景圖。支持 IE6/7,
Firefox 2/3 以及 Safari,甚至支持 iPhone.
7. EJSChart

EJSChart 支持鼠標(biāo)追蹤,鼠標(biāo)事件,按鍵追蹤與事件,縮放,滾動(dòng),交互等功能,將用戶體驗(yàn)上升到一個(gè)新高度。支持曲線圖,面積圖,離散圖,圓餅圖,柱狀圖等形式,擁有完備文檔的屬性和方法可以幫助實(shí)現(xiàn)很好的定制。
8. fgCharting
fgCharting 是一個(gè)很出色的 jQuery 插件,支持多種圖形。
9. Pure Css Data Chart

以往的數(shù)據(jù)展示往往通過(guò) flash 實(shí)現(xiàn),現(xiàn)在,我們可以通過(guò)純粹的 CSS 實(shí)現(xiàn)類似的功能。CSSGlobe 有一個(gè)非常實(shí)用的教程幫你實(shí)現(xiàn)基于 CSS 的繪圖,甚至不需要 JavaScript。
本文國(guó)際來(lái)源:http://woork.blogspot.com/2009/03/useful-scripts-to-plot-charts-in-web.html
中文翻譯來(lái)源:COMSHARP CMS 官方網(wǎng)站
摘自:http://www.cnbeta.com/articles/79418.htm