推薦！數(shù)據(jù)可視化的十種優(yōu)秀JavaScript圖表庫
譯文【51CTO.com快譯】如今，隨著我們身體各類數(shù)據(jù)的指數(shù)級增長，人們需要接受的信息量越來越大，系統(tǒng)必須處理的難度也是越來越高。而這些正是我們需要通過交互式圖表和儀表盤，來實現(xiàn)數(shù)據(jù)可視化的根本原因。在大幅節(jié)省用戶的時間和精力的同時，此類可視化方式不但需要能夠?qū)?shù)據(jù)進行分析與解讀，而且應當能夠基于海量數(shù)據(jù)做出正確且明智的決策。
現(xiàn)在，網(wǎng)上有許多JavaScript類型的圖表庫資源。它們功能不同，且各有優(yōu)、缺點。為了讓您能夠輕松地進行挑選，我在此準備了十種既可用于創(chuàng)建基本的圖表，又能夠處置各種特定數(shù)據(jù)可視化任務的***JS庫。下面，就讓我們一起來了解一下它們的主要特點和相關(guān)資源吧。
1.amCharts
當您需要一個簡單且靈活的數(shù)據(jù)可視化解決方案時，amCharts便是一種非常實用的JavaScript圖表庫。
主要特點
- 包含地圖和甘特圖等多種類型的圖表。
- 具有友好的交互式選項和深入分析的功能。
- 其文檔雖然涵括了所有基本的方法，但是在我看來，它們在使用上并不方便。
- 具有引人入勝的圖表動畫。
- 可以與React、Angular、Vue和Ember相集成。
- 具有WordPress插件。
- 可導出為圖像或PDF文件。
- 提供實時圖表，以及完全自定義的、且被W3C認可的輔助功能。
- 為注冊用戶提供優(yōu)先且全面的支持。
- 客戶群：Microsoft、Amazon、eBay、NASA、Samsung、Yandex、以及AT&T等。
定價
雖然可以被免費地用于各種用途，但是所有生成的圖表都會包含一個小小的品牌鏈接。若要刪除該鏈接，則需購買付費許可證(180美元起)。同時，您也將為此獲得對于該產(chǎn)品的優(yōu)先支持。
更多信息
- 官方網(wǎng)站：http://amcharts.com/
- 文檔：http://amcharts.com/
- 下載鏈接：http://amcharts.com/download
2.AnyChart
作為一款輕量級的JS圖表庫，AnyChart不但功能豐富，而且具有SVG/VML(譯者注：可縮放矢量圖形和矢量可標記語言)呈現(xiàn)功能。實際上，它為Web開發(fā)人員提供了創(chuàng)建不同類型圖表的***機會。這些圖表都有助于數(shù)據(jù)的分析，以及以數(shù)據(jù)為驅(qū)動所做出的決策。去年，DZone.com將AnyChart列入了***JavaScript數(shù)據(jù)圖表庫之一。
主要特點
- 提供超過80多種JS圖表類型，包括：基本圖表、股票圖表、地圖、甘特圖、以及PERT圖表等。
- 提供多種設置數(shù)據(jù)的方法，包括：XML、JSON、CSV、JS API、Google表格和HTML表格。
- 能夠深入查看圖表中的數(shù)據(jù)。
- 提供庫存技術(shù)分析指標，以及開箱即用的繪圖工具。
- 提供豐富的文檔、API和友好的技術(shù)支持。
- 可以與Angular、Qlik、Oracle APEX、React、Elasticsearch、Vue.js、Android、以及iOS等相集成。
- 提供各種樣本與儀表盤，以及具有代碼自動完成功能的專用playground。
- 支持各種舊的瀏覽器。
- 能夠?qū)D表導出為各種格式，包括：PDF、JPG、PNG、SVG圖像、XSLX與CSV文件類型的數(shù)據(jù)。
- 客戶群：Oracle、Microsoft、Citi、Samsung、Nokia、AT&T、Ford、Volkswagen、以及Lockheed Martin等。
定價
提供免得的帶水印版本。如果想去掉logo，或是將AnyChart用作商業(yè)目的，則必要購買許可證(49美元起)。
更多信息
- 官方網(wǎng)站：https://www.anychart.com/
- 文檔：https://docs.anychart.com/
- 下載鏈接：https://docs.anychart.com/
3.Chart.js
Chart.js是一款備受網(wǎng)頁設計與開發(fā)人員歡迎的，簡單且靈活的JavaScript數(shù)據(jù)圖表庫。對于那些不需要大量圖表與自定義功能，卻又希望其圖表看起來清晰整潔、且信息量豐富的用戶來說，這是一個非常好的基本解決方案。
主要特點
- 支持8種圖表類型，即：線、面積、條形圖、餅圖、雷達圖、極坐標圖、氣泡圖和散點圖。
- 所有的圖表類型都可以被自定義、添加動畫、并以響應式，被在線使用。
- 可以通過插件來擴展其功能。
- 具有優(yōu)質(zhì)的文檔。
- 由Stack Overflow(譯者注：著名的程序開發(fā)技術(shù)問答網(wǎng)站)提供支持。
- 支持IE9及以上的瀏覽器。
定價
它是一款根據(jù)MIT許可證發(fā)布的，免費開源的JS圖表庫。
更多信息
- 官方網(wǎng)站：https://www.chartjs.org/
- 文檔：https://www.chartjs.org/docs/
- 下載鏈接：https://github.com/chartjs/Chart.js/releases/latest
4.Chartist.js
Chartist雖然是一款不太引人注目的開源JS庫，但是它能夠被用來創(chuàng)建漂亮的響應式圖表。因此，它對于那些需要極簡式圖表(如：線條、條形圖或餅圖)、且對于數(shù)據(jù)可視化要求不高的用戶來說，非常實用。正所謂“一美遮百丑”，憑借著其漂亮的圖表顯示，它的其他功能倒是被弱化了。
主要特點
- 只支持三種圖表類型：直線圖、條形圖和餅圖。
- 具有強大的動畫效果。
- 其API文檔包含了所有必要的信息，但是該文檔的可讀性不強，需要長時間滾動鼠標中鍵，才能定位到檢索的內(nèi)容。
- 允許用戶通過插件來擴展其功能。
- 將來會兼容、并可使用SVG來繪制圖表。
- 支持各種舊的瀏覽器。
定價
開源并可免費使用。
更多信息
- 官方網(wǎng)站：https://gionkunz.github.io/chartist-js/
- 文檔：https://gionkunz.github.io/chartist-js/getting-started.html
- 下載鏈接：https://github.com/gionkunz/chartist-js/tree/develop/dist
5.D3.js
D3.js是一款功能強大的，可用于數(shù)據(jù)可視化任務的JavaScript庫。目前，它已在GitHub上被fork(復制)了20,000多次。不過，D3更像是一個框架，而不是圖表庫。為了讓用戶方便使用，它提供了許多實用的資源，并能夠?qū)⒏鞣N手稿轉(zhuǎn)化為可視化的圖形。
主要特點
- 與諸如Voronoi之類的多數(shù)JavaScript圖表庫相比，它能夠支持更為廣泛的圖表類型。
- 它的學習曲線比較陡峭。雖然其文檔不及上述提到的商用AnyChart那樣清楚易學，但是它帶有許多教程和各種不錯的API。
- 能夠?qū)姶蟮目梢暬M件、與數(shù)據(jù)驅(qū)動方法，結(jié)合到DOM的操作之中。
- 能夠使用瀏覽器內(nèi)的元素檢查器，以實現(xiàn)輕松的調(diào)試。
- 帶有數(shù)以百個的范例。
- 具有曲線生成函數(shù)的功能。
- 支持拖放。
定價
開源并可免費使用。
更多信息
- 官方網(wǎng)站：http://d3js.org/
- 文檔：https://github.com/d3/d3/wiki
- 下載鏈接：https://github.com/d3/d3/releases/latest/
6.FusionCharts
FusionCharts是一款不錯的交互式圖表庫，它帶有數(shù)百個開箱即用的圖表。這些圖表不但接受JSON和XML數(shù)據(jù)格式，而且能夠通過HTML5/SVG或VML予以呈現(xiàn)。
主要特點
- 提供數(shù)十種2D和3D類型的圖表，以及950多種地圖。
- 以動畫和完全交互的方式，提供圖表和地圖。
- 提供ASP.NET、PHP和Ruby on Rails類型的服務器端API。
- 兼容jQuery、Angular、PHP、ASP.NET、React Native、Django、React、Ruby on Rails、以及Java等語言工具。
- 具有非常詳細的用戶指南和API參考文檔。
- 提供各種可用于檢測的樣品和儀表盤。
- 支持各種舊的瀏覽器。
- 可導出為PNG、JPG或PDF格式。
- 通過知識庫和社區(qū)論壇提供技術(shù)支持。
- 給許可證用戶提供不受限的優(yōu)先支持。
- 客戶群：Apple、IBM、Google、Intel、Microsoft、PayPal、Oracle、以及Adobe等。
定價
可免費用于非商業(yè)用途;若用于商業(yè)用途，則售價為497美元起。
更多信息
- 官方網(wǎng)站：https://fusionchart.com/
- 文檔：https://www.fusioncharts.com/dev
- 下載鏈接：https://www.fusioncharts.com/download
7.Google Charts
對于那些不需要復雜定制、且更注重簡約與穩(wěn)定性的項目來說，Google Charts是一個很好的選擇。
主要特點
- 提供基于HTML5/SVG和VML的圖表。
- 提供各種可用于檢測的樣品和儀表盤。
- 在所有圖表都具有交互性的基礎上，部分圖表還可被縮放。
- 提供完善的綜合性文檔。
- 支持各種舊的瀏覽器。
- 通過FAQ、GitHub和社區(qū)論壇提供支持。
定價
雖然其許可證是免費的，但圖表庫并不開源。由于不允許在用戶服務器上托管Google的各種JS文件，因此不適合那些具有敏感數(shù)據(jù)的用戶。
詳細信息
- 官方網(wǎng)站：https://developers.google.com/chart/
- 文檔：https://developers.google.com/chart/interactive/docs/
- 下載鏈接：https://developers.google.com/chart/interactive/docs/basic_load_libs
8.Highcharts
Highcharts是一款全面、且流行的、基于HTML5的JavaScript圖表庫，它使用SVG/VML來呈現(xiàn)各種類型的圖表。由于屬于輕量級的圖表庫，因此它保證了較高的運行性能。
主要特點
- 既能夠使用純粹的JavaScript，又可以從外部加載數(shù)據(jù)。
- 提供強大的文檔、API參考和社區(qū)作品展示。
- 能夠通過交互式選項，讓用戶深入解讀圖表中的數(shù)據(jù)。
- 可以與React、Angular、Meteor、.NET、以及iOS等一起使用。
- 可以導出為PNG、JPG、PDF或SVG格式。
- 能夠通過社區(qū)論壇和Stack Overflow的方式，對免費版用戶提供支持;而對于具有相應許可證的商業(yè)用戶來說，則能夠提供高級的電子郵件與Skype技術(shù)支持。
- 客戶群：Visa、Yahoo!、Facebook、Twitter、Groupon、Nokia、Ericsson、Mastercard、以及Yandex等。
定價
供非營利組織免費使用;而對于商業(yè)用途，則售價為50美元起。
更多信息
- 官方網(wǎng)站：https://highcharts.com/
- 文檔：https://www.highcharts.com/docs
- 下載鏈接：https://www.highcharts.com/blog/download
9.Plotly.js
Plotly.js是一款免費且開源的高端JavaScript軟件庫。由于是建立在D3.js和WebGL基礎之上，因此它可被用于創(chuàng)建包括3D圖、和統(tǒng)計圖在內(nèi)的許多不同類型的圖表。
主要特點
- 可被嵌入網(wǎng)站、或用于創(chuàng)建動態(tài)演示文稿，并支持20種圖表類型。
- 通過將各種圖表抽象為聲明性的JSON結(jié)構(gòu)，它可以被Python、R和MATLAB用作基于瀏覽器的圖表庫。
- 具有豐富的API文檔。
- 具有強大的動畫效果。
- 能夠使用React。
- 能夠?qū)D表導出為PNG和JPG;并在訂購之后，提供EPS、SVG和PDF格式。
- 提供各種可用于檢測的樣品。
- 允許使用Excel電子表格、或直接連接到您的數(shù)據(jù)庫中。
- 具有社區(qū)論壇的支持。
定價
開源并可免費使用。
更多信息
- 官方網(wǎng)站：https://plot.ly/javascript/
- 文檔：https://plot.ly/javascript/
- 下載鏈接：https://plot.ly/javascript/getting-started/#download
10.ZingChart
ZingChart是一款可用于制作交互式與響應式圖表的實用工具。它不但靈活高效，而且能夠輕松地管理大數(shù)據(jù)，同時還能生成包含豐富數(shù)據(jù)內(nèi)容的圖表。
主要特點
- 支持30多種圖表類型。
- 可完全定制不同的CSS風格版式。
- 兼容jQuery、Angular、Node.js、以及PHP等。
- 提供實時數(shù)據(jù)，并能快速地呈現(xiàn)任意大小的數(shù)據(jù)集。
- 可以通過JS對象、JSON、CSV、PHP、AJAX或MySQL來加載數(shù)據(jù)。
- 提供完整且易讀的API。
- 通過ZingChart的幫助中心、Stack Overflow、電子郵件、以及聊天工具，提供免費和高級的技術(shù)支持。
- 客戶群：Microsoft、Boeing、Adobe、Apple、Cisco、Google、以及Alcatel等。
定價
只要擁有其品牌許可證，便能免費擁有其圖表庫的完全訪問權(quán)限。而對于商業(yè)用途，則需購買許可證，售價為199美元起。
更多信息
官方網(wǎng)站：http://zingchart.com/
下載鏈接：http://zingchart.com/try/
結(jié)論
上面所列的十款JavaScript圖表庫可謂各有千秋，有的運行得更快、有的顯示得更漂亮、而有的卻更加靈活。正如“一千個人眼中有一千個哈姆雷特”那樣，到底選用哪一種圖表庫，最終還是取決于您手頭上的項目特點和具體的應用需求。
原文標題：10 Best JavaScript Charting Libraries for Any Data Visualization Need，作者：Ruslan Borovikov
【51CTO譯稿，合作站點轉(zhuǎn)載請注明原文譯者和出處為51CTO.com】
