如今，在互聯(lián)網(wǎng)上發(fā)布在線免費(fèi)的Javascript圖形和圖表繪制工具越來越多。我此前在一家網(wǎng)站從事復(fù)雜的圖形學(xué)方面的工作，使用highchart，在那期間，沒有大量的插件工具可供選擇，不像現(xiàn)在，我們可以輕易地找到非常有用的圖表庫。個(gè)人認(rèn)為，此種插件的興起源于：

• Flash 過去是最佳解決方案，但現(xiàn)在很多人都轉(zhuǎn)變了；
• 現(xiàn)代瀏覽器及其更強(qiáng)大的計(jì)算能力，使其在轉(zhuǎn)化繪制實(shí)時(shí)數(shù)據(jù)方面的能力更佳；
• 繪制矢量圖的不同技術(shù)愈發(fā)成熟：VML、SVG 和 Canvas。

當(dāng)然了，你需要仔細(xì)選擇，以符合自身需求。正如前面提到的，正因使用了各種技術(shù)，因此一些支持Canvas的插件僅需要一個(gè)現(xiàn)代瀏覽器。

在這篇文章中，我們搜集了14個(gè)JavaScript插件可用于繪制圖形和圖表。少數(shù)是獨(dú)立的框架，大多數(shù)支持條圖、線圖、餅圖等基本圖形，很多甚至支持更加復(fù)雜的圖形，比如：維恩圖、熱圖、進(jìn)化樹、二維散點(diǎn)圖、二維散點(diǎn)氣泡圖、三維散點(diǎn)圖等。相信你應(yīng)當(dāng)能在這個(gè)列表中找到所需的。

1. FusionCharts

FusionChart是最強(qiáng)大的javascript圖表插件。它支持多種實(shí)用功能，比如工具提示、可點(diǎn)擊圖例項(xiàng)標(biāo)示、易鉆取、縮放、滾動(dòng)、導(dǎo)出和打印。其跨平臺(tái)支持使我們很容易在Windows、Mac和移動(dòng)平臺(tái)上實(shí)現(xiàn)圖表。最后，如果您熟悉jQuery，它也可以同時(shí)作為本機(jī)jQuery圖表插件。

想要了解FusionChart更多范例，請(qǐng)查看Demo或示例。

Flotr2 是個(gè)獨(dú)立框架庫，支持HTML5圖表和圖形。它是 flotr 的一個(gè)分支版本，移除了 Prototype 依賴性，并且有很多改進(jìn)。支持：線圖、條圖、蠟狀圖、餅圖、氣泡圖。諸如 IE6 類的老瀏覽器也支持。

Rickshaw 是個(gè)用于創(chuàng)建交互式時(shí)序圖的JS工具箱。它依賴于 D3 可視化庫和其他一些 jQuery 和 jQuery UI 的插件。

D3 是一款出色且高效的可視化庫，可用于圖表的插件。使用D3你可以捆綁任意一個(gè)數(shù)據(jù)到DOM（Document Object Model），然后采用數(shù)據(jù)驅(qū)動(dòng)轉(zhuǎn)化成文件。 作為一個(gè)示例，你可以用D3從數(shù)組中生成一個(gè)基本的 HTML表格。或者你也可以利用相同的數(shù)據(jù)來創(chuàng)建一個(gè)互動(dòng)的SVG柱狀圖。

AwesomeChartJS作為一個(gè)簡(jiǎn)單的Javascript庫，它可以被用來創(chuàng)建基于HTML 5 canvas元素的圖表。目的是讓用戶只需用幾行代碼就可創(chuàng)建一個(gè)簡(jiǎn)單的圖表。

CanvasXpress是一個(gè)Javascript庫利用tag在HTML5中執(zhí)行任務(wù)，該庫開發(fā)的目的是為 BMS系統(tǒng)生物學(xué)平臺(tái)創(chuàng)建可視化的核心組件。它適用于高度復(fù)雜的圖表和圖形。

HumbleFinance是HTML5數(shù)據(jù)可視化編譯工具。作為交互式圖形的范本，與Flash工具類似，工具本身是用JavaScript編譯的，使用Prototype和Flotr 庫，它可以用于顯示實(shí)際數(shù)值共享一個(gè)軸的任意兩個(gè)2D數(shù)據(jù)集。

RGraph是HTML5 Javascript圖表庫支持超過20種不同類型的圖表。使用HTML5 canvas標(biāo)簽，RGraph可以在Web瀏覽器中創(chuàng)建Javascript圖表。也是就說頁面響應(yīng)時(shí)間更快，Web服務(wù)器加載時(shí)間更少。

dygraphs是一個(gè)開源的 JavaScript庫，可生成時(shí)間系列的交互式zoomable圖表。它的設(shè)計(jì)是被用來顯示密集型的數(shù)據(jù)集，能夠讓用戶探索和解釋這些數(shù)據(jù)。這是一款輕量級(jí)的解決方案，運(yùn)行在IE中。

10. HighChart

Highchart是用純JS編寫的圖表庫，給你的網(wǎng)站或者Web應(yīng)用呈現(xiàn)最直觀、交互式的圖表。 Highcharts 目前支持折線、曲線、區(qū)域、區(qū)域曲線圖、柱形圖、條形圖、餅圖、散點(diǎn)圖、角度測(cè)量圖、區(qū)域排列圖、區(qū)域曲線排列圖、柱形排列圖、極坐標(biāo)圖等圖表類型。這個(gè)著名的圖表解決方案曾被許多知名的企業(yè)使用，比如 IBM、NASA、Siemens、HP等。

更多Highcharts demo或示例，請(qǐng)點(diǎn)擊資源查看。

gRaphael的目標(biāo)是為您的網(wǎng)站創(chuàng)建絕妙的圖表，基于Rapha?l 圖形庫。通過示例能看到靜態(tài)和動(dòng)態(tài)的圖表場(chǎng)景。gRapha?l目前支持Firefox 3.0+，Safari 3.0+, Opera 9.5+、IE 6.0+以上版本。

jqPlot是jQuery Javascript 框架的繪圖和圖表插件。 jqPlot能繪制出美妙的line，bar和pie圖形，具有許多獨(dú)特的性能。

13. JS Charts

JS Charts是JavaScript只需很少或者無需代碼即可實(shí)現(xiàn)的圖形生成器。利用JS來繪制圖表既簡(jiǎn)單又容易，因?yàn)槟阒恍枰蛻舳四_本即可實(shí)現(xiàn)（通過Web瀏覽器實(shí)現(xiàn)）。無需額外的插件或者服務(wù)器模塊。只需要準(zhǔn)備腳本、XML圖表數(shù)據(jù)，JSON或JavaScript Array和繪圖工具即可。

更多JS Chartsdemo或資訊，請(qǐng)點(diǎn)擊資源查看。

JSXGraph是一款跨瀏覽器的交互式幾何圖、函數(shù)繪圖、圖表的數(shù)據(jù)可視化工具。它完全在JavaScript實(shí)現(xiàn)，不依賴于任何庫，并且使用SVG，VML和canvas。JSXGraph容易嵌入網(wǎng)頁中，體積小，小于100K字節(jié)。無插件，采取特別措施優(yōu)化性能。

本文翻譯自：

不知道怎樣選擇和圖表工具？聯(lián)系【】

點(diǎn)擊【圖表專題】了解更多圖表類資訊