編譯地址：Are you ready for the era of big data? 14 popular JavaScript based data visualization tools
原文地址：http://efe.baidu.com/blog/14-popular-data-visualization-tools/
俗話說罪郊，一圖勝千言俗扇。圖形化的信息可以讓人們對數(shù)據(jù)有更加直觀清晰的理解改基，讓信息發(fā)布者更加高效地展示自己的核心內(nèi)容。在前端開發(fā)中，如果缺少合適工具蜂大，制作數(shù)據(jù)可視化圖表會十分復(fù)雜。然而隨著數(shù)據(jù)可視化概念逐年火熱，有較多優(yōu)秀的圖表開源庫和制作工具脫穎而出魄梯。下面，我們就拿其中比較有名的 14個產(chǎn)品進(jìn)行簡要介紹宾符。
AnyChart 是基于 Flash/JavaScript(HTML5) 的圖表解決方案酿秸，它可以輕松地跨瀏覽器、跨平臺工作魏烫。除了基礎(chǔ)的圖表功能外辣苏，它還有收費(fèi)的交互式圖表和儀表功能肝箱。它可以通過 XML 格式獲取數(shù)據(jù)，該方式讓開發(fā)人員非常靈活地控制圖表上的每一個數(shù)據(jù)點(diǎn)稀蟋，而當(dāng)圖表數(shù)據(jù)點(diǎn)數(shù)量偏大時煌张，則可以采用 CSV 數(shù)據(jù)輸入，減小數(shù)據(jù)文件大小和圖表加載時間退客。
amCharts 是一款高級圖表庫骏融，致力于對 Web 上的數(shù)據(jù)可視化提供支持。它所支持的圖表包括柱狀圖萌狂、條狀圖档玻、線圖、蠟燭圖茫藏、餅圖误趴、雷達(dá)、極坐標(biāo)圖务傲、散點(diǎn)圖凉当、燃燒圖和金字塔圖等等。amCharts 庫是一款完全獨(dú)立的類庫树灶，在應(yīng)用中不依賴任何其他第三方類庫纤怒，就可直接編譯運(yùn)行。除了提供最基本的規(guī)范要素外天通，amCharts 還提供了交互特性泊窘。用戶在瀏覽基于 amCharts 制作的圖表時，用鼠標(biāo) hover 圖表內(nèi)容像寒，可以與其進(jìn)行交互烘豹，使圖表展示細(xì)節(jié)信息，其中呈現(xiàn)信息的容器被叫做 Balloon（氣球）诺祸。除此之外圖表可以動態(tài)動畫的形式被繪制出來携悯，帶來了了非常好的展示效果。
Cesium 同樣專注于地理數(shù)據(jù)可視化筷笨，它是一個 Javascript 庫憔鬼，可以在 Web 瀏覽器中繪制 3D/2D 地球。無需任何插件即可基于 WebGL 來進(jìn)行硬件加速胃夏。除此之外轴或，它還有跨平臺、跨瀏覽器的特性仰禀。Cesium 本身基于 Apache 開源協(xié)議照雁，支持商業(yè)及非商業(yè)項(xiàng)目。
Chart.js 是一個簡單答恶、面向?qū)ο蠼任茫瑸樵O(shè)計(jì)和開發(fā)者準(zhǔn)備的圖表繪制工具庫萍诱。它提供了六種基礎(chǔ)圖表類型∥酆簦基于 Html5裕坊，響應(yīng)式，支持所有現(xiàn)代瀏覽器燕酷。同時它不依賴任何外部工具庫碍庵，本身輕量級，且支持模塊化悟狱，即開發(fā)者可以拆分 Chart.js 僅引入自己需要的部分進(jìn)入工程静浴。在小巧的身段中它同時支持可交互圖表。
鏈接：https://gionkunz.github.io/chartist-js/
Chartist.js 是一個非常簡單而且實(shí)用的 JavaScript 圖表生成工具挤渐，它支持 SVG 格式苹享，圖表數(shù)據(jù)轉(zhuǎn)換靈活，同時也支持多種圖表展現(xiàn)形式浴麻。在工程中得问，Chartist.js 的 CSS 和 JavaScript 分離，因此代碼比較簡潔软免，在應(yīng)用時配置流程十分簡單宫纬。它生成的是響應(yīng)式圖表，可以自動支持不同的瀏覽器尺寸和分辨率膏萧，更多的是漓骚，它也支持自定義 SASS 架構(gòu)。
鏈接：http://vis.stanford.edu/papers/d3
2011年榛泛，Mike Bostock蝌蹂、Vadim Ogievetsky 和 Jeff Heer 發(fā)布了 D3，它是目前 Web 端評價最高的 Javascript 可視化工具庫曹锨。D3 能夠向用戶提供大量線性圖和條形圖之外的復(fù)雜圖表樣式孤个，例如 Voronoi 圖、樹形圖沛简、圓形集群和單詞云等等齐鲤。它的優(yōu)點(diǎn)是實(shí)例豐富，易于實(shí)現(xiàn)調(diào)試數(shù)據(jù)同時能夠通過擴(kuò)展實(shí)現(xiàn)任何想到的數(shù)據(jù)可視化效果椒楣，缺點(diǎn)是學(xué)習(xí)門檻比較高给郊。與 jQuery 類似，D3 直接對 DOM 進(jìn)行操作撒顿，這是它與其它可視化工具的主要區(qū)別所在：它會設(shè)置單獨(dú)的對象以及功能集丑罪，并通過標(biāo)準(zhǔn) API 進(jìn)行 DOM 調(diào)用荚板。
一款免費(fèi)開源的數(shù)據(jù)可視化產(chǎn)品凤壁，給用戶提供直觀吩屹、生動、可交互和可個性化定制的數(shù)據(jù)可視化圖表拧抖。Echarts 上手簡單煤搜。其具有的拖拽重計(jì)算、數(shù)據(jù)視圖唧席、值域漫游等特性大大增強(qiáng)了用戶體驗(yàn)擦盾，幫助用戶在對數(shù)據(jù)挖掘、整合時大幅提高效率淌哟。同時迹卢，Echarts 提供了豐富的圖表類型，除了常見的折柱餅徒仓，還支持地圖腐碱、力導(dǎo)向圖、treemap掉弛、熱力圖症见、樹圖等等。更驚艷的是殃饿，它還支持任意維度的堆積和多圖表混合展現(xiàn)谋作。總而言之乎芳，這是一款讓我們非常驚喜的可視化產(chǎn)品遵蚜，非常強(qiáng)大，不過他圖表不是很美觀奈惑，對移動端的支持也還有些欠缺谬晕，不過這些問題在官方最新發(fā)布的3.0beta中得到了很大改善
Flot 是一個純 Javascript 繪圖庫，作為 jQuery 的插件使用携取。它可以較為輕松地跨瀏覽器工作攒钳，甚至包括 IE6。因?yàn)?jQuery 的特性雷滋，開發(fā)者可以全面地控制圖表的動畫不撑、交互，把數(shù)據(jù)的呈現(xiàn)過程優(yōu)化得更加完美晤斩。
鏈接：http://www.fusioncharts.com/
FusionCharts Free 是可跨平臺焕檬、跨瀏覽器的 Flash 圖表解決方案，它能夠被 ASP澳泵、.NET实愚、PHP、JSP、ColdFusion腊敲、Ruby on Rails击喂、簡單 HTML 頁面甚至 PPT 調(diào)用。在使用過程中碰辅，用戶原則上并不需要知道任何 Flash 的知識懂昂，只需要了解你所用的編程語言，并進(jìn)行簡單的調(diào)用即可以實(shí)現(xiàn)應(yīng)用没宾。
鏈接：http://developers.google.com/chart/
不需要多介紹凌彬，大家都非常了解的可視化工具循衰。
HighCharts 是一個界面美觀会钝，時下非常流行的的純 Javascript 圖表庫原探。它實(shí)際上由兩部分組成：HighCharts 和 Highstock。其中 HighCharts 能夠很便捷地在 Web 網(wǎng)站或是 Web 應(yīng)用程序中添加可交互圖表顽素，并可免費(fèi)用于個人學(xué)習(xí)、個人網(wǎng)站和其他非商業(yè)用途型型。目前 HighCharts 支持的圖表類型有曲線圖、區(qū)域圖全蝶、柱狀圖闹蒜、餅狀圖、散點(diǎn)圖和一些綜合圖表抑淫。而 HighStock 可以為用戶方便地建立股票或一般的時間軸圖表始苇。它提供先進(jìn)的導(dǎo)航選項(xiàng)，預(yù)設(shè)的日期范圍函喉，日期選擇器荣月，滾動和平移等公盟。
Leaflet 是一個可以同時良好運(yùn)行于桌面和移動端的 Javascript 可交互地圖庫捐下。它使用 OpenStreetMap 的數(shù)據(jù)，并把可視化數(shù)據(jù)集中在一起奸柬。Leaflet 庫的內(nèi)核庫很小啤握，但由豐富的插件可以大幅拓展其功能晶框，常常被用于需要展示地理位置的項(xiàng)目授段。
鏈接：http://metricsgraphicsjs.org/
MetricsGraphics.js 是一個基于 D3，為可視化和時間序列化的數(shù)據(jù)而優(yōu)化的庫届搁。它提供了一種便捷的方法窍育，用一致且響應(yīng)式方式來產(chǎn)生相同類型的圖形。它現(xiàn)在支持折線圖表锻、散點(diǎn)圖乞娄、直方圖仪或、地毯圖和基本的線性回歸圖。同時范删，它體積非常小巧，通呈可以控制在 60kb 之內(nèi)厢绝。
Sigma.js 是一個專注于圖形繪制的 Javascript 庫昔汉，它可以讓開發(fā)者輕松地在自己的 Web 應(yīng)用中發(fā)布網(wǎng)絡(luò)圖。它給提供了很多設(shè)置項(xiàng)会通，使開發(fā)者可以自由地定義網(wǎng)絡(luò)圖的繪制方式。同時其也提供了豐富的 API沪停，例如移動視圖裳涛、刷新渲染端三、事件監(jiān)聽等等都可以輕易實(shí)現(xiàn)，這讓開發(fā)者可以在交互上進(jìn)行更多拓展妻献。
