12個值得收藏的強大的Javascript數據可視化庫

我們生活在這個數據信息爆炸的裏時代,我們開發的每個應用程序都使用或利用了數據來改善我們的各種用戶體驗。
有時,我們可以給用戶提供最佳的數據本身功能。表格和數字圖表通常很容易閱讀,但很難從大型數據表中獲得可行的直接見解。

相反,我們可以使用整潔的數據可視化方法,這些方法可以利用大腦以視覺方式識別和處理數據的能力。爲了幫助你入門並輕鬆將漂亮的數據可視化添加到你喜歡的應用程序中。
以下是我總結整理的一些最佳的Javascript數據可視化庫。你也可以隨時發表評論並添加自己的建議和見解!
例如:https://bit.dev
提示:使用Bit可以在應用之間快速重用UI組件。使用雲庫爲你的團隊提供支持,以加快您的應用開發速度。這些都是免費的。

1、D3js

D3.js獲得了80Kstars,可能是其中最受歡迎和最廣泛的Javascript數據可視化庫。D3用於處理基於數據的文檔,並使用HTML,SVG和CSS使數據栩栩如生。D3對網絡標準的重視使你無需結合專有框架即可將現代瀏覽器的功能與之結合,而是結合了可視化組件和數據驅動的DOM操作方法。它允許你將任意數據綁定到文檔對象模型(DOM),然後將數據驅動的轉換應用於文檔。這是一個很棒的示例畫廊。
但也有人說D3根本不是數據可視化庫。

2、ChartJS

一個非常流行的(40k stars)開源HTML 5圖表庫,用於使用canvas元素的響應式Web應用程序。V.2提供了混合的圖表類型,新增了圖表軸類型和動畫。界面設計簡單優雅,具有8種基本圖表類型,你可以將庫與moment.js組合爲時間軸。你也可以在cdnjs上籤出庫。
3、ThreeJS

這個是非常受歡迎的庫(45K stars;1K貢獻者)內置用於使用WebGL創建3D動畫。該項目靈活而抽象的性質意味着它對於可視化2維或3維數據也很有用。例如,你也可以使用指定的模塊通過WebGL進行3D圖形可視化。

4、Echarts & Highcharts

百度的Echarts項目(30K stars)是用於瀏覽器的交互式圖表和可視化庫。它是用純JavaScript編寫的,基於zrender canvas庫。它支持Canvas,SVG(4.0+)和VML形式的渲染圖。除了PC和移動瀏覽器之外,ECharts還可以與節點上的節點畫布一起使用,以實現高效的服務器端渲染(SSR)。這是指向完整示例的場景鏈接,每個示例都可以在交互式場景上播放。

Highcharts JS是一個8Kstars,是基於SVG的廣受歡迎的JavaScript圖表庫,具有舊瀏覽器的VML和canvas的後備功能。它聲稱eb被全球100家最大的公司中的72家使用,這使其(可能)成爲世界上最受歡迎的JS圖表API(Facebook,Twitter)。

5、 Metric-Graphics

MetricsGraphics.js(7k stars)是一個優化的庫,用於可視化和佈局時間序列數據。它相對較小(最小80kb),並且提供折線圖,散點圖,直方圖,條形圖和數據表的狹窄而優雅的選擇,以及地毯圖和基本線性迴歸等功能。這是一個交互式示例庫的鏈接。

6、Recharts

Recharts是使用React和D3構建的圖表庫,可讓你將其部署爲聲明性的React組件。該庫提供了本機SVG支持,可通過組件屬性高度自定義輕量級依賴關係樹(D3子模塊)。你可以在docs網站上找到實時示例。

7. Raphael

一個10k stars的Javascript“矢量庫”,用於處理網絡中的矢量圖形。該庫使用SVG W3C Recommendation和VML作爲創建圖形的基礎,因此每個圖形對象也是DOM對象,您可以附加JavaScript事件處理程序。Raphaël當前支持Firefox 3.0 +,Safari 3.0 +,Chrome 5.0 +,Opera 9.5+和Internet Explorer 6.0+。

8、C3js

C3是8k stars,是一個用於Web應用程序的基於D3的可重用圖表庫。該庫爲每個元素提供類,因此您可以通過該類定義自定義樣式,並通過D3直接擴展結構。它還提供了各種API和回調來訪問圖表狀態。通過使用它們,你甚至可以在繪製圖表後對其進行更新。看一下這些例子:
https://c3js.org/examples.html

9、 React Virtualized + React Vis + Victory

React-vis(4k stars )是Uber的一組React組件,用於以一致的方式可視化數據,包括折線圖/面積圖/條形圖,熱圖,散點圖,輪廓圖,六邊形熱圖等。該庫不需要具備D3或其他任何數據可見庫的知識,並且提供了諸如X / Y軸之類的低級模塊化構建塊組件。與Bit一起工作的絕佳選擇,並且是一個非常有用的庫。

React virtualized (12k stars )是一組React組件,用於有效地渲染大型列表和表格數據。每個發行版均提供ES6,CommonJS和UMD構建,並且該項目支持Webpack 4工作流程。請注意,必須將react,react-dom指定爲對等依賴項,以避免版本衝突。趕緊去試試看。

Victory是由Formidable Labs構建的具有超過6k stars 的React可組合React組件的集合,用於構建交互式數據可視化。Victory對Web和React Native應用程序使用相同的API,以實現輕鬆的跨平臺圖表繪製。一種優雅而靈活的方法,可以利用React組件來支持實際數據可視化。我個人非常喜歡。
當使用單個組件時,這些庫與Bit完美結合,可以在應用程序之間共享並同步它們。

10、 CartoDB

Carto是2k stars,是一種位置情報和數據可視化工具庫,用於發現基礎位置數據的信息。你可以使用Web表單上傳地理空間數據(Shapefiles,GeoJSON等),並在數據集或地圖中將其可視化,使用SQL進行搜索,以及使用CartoCSS應用地圖樣式。這裏有很多視頻演示(https://vimeo.com/channels/carto),可幫助您理解和入門。

11. Raw graphs

Raw超過5K stars,是電子表格和數據可視化之間的鏈接,旨在d3.js庫的頂部創建基於矢量的自定義可視化。它適用於表格數據(擴展名和逗號分隔的值),以及來自其他應用程序的數據複製粘貼文本後生成可視化數據表。基於SVG格式,可使用矢量圖形應用程序進行編輯以進一步完善,也可以直接嵌入到網頁中。

12. Metabase

Metabase的運行時間超過11k stars,是一種無需瞭解SQL即可創建數據儀表盤的快速簡便的方法(但對於分析人員和數據專家而言,卻具有SQL模式)。你可以創建規範的細分指標,將數據發送到Slack(並使用MetaBot在Slack中查看數據)等等。儘管可能需要維護,但它可能是一個很好用的工具,可以爲你的團隊內部可視化數據。

補充:tauCharts

tauCharts是一個基於D3且以數據爲中心的圖表庫,有2K左右 stars。該庫提供了一個聲明性接口,用於將數據字段快速映射到可視界面中,並且其體系結構允許你使用可重用的插件構建並擴展圖表。是不是看起也還不錯吧?

原文 |https://blog.bitsrc.io/11-javascript-charts-and-data-visualization-libraries-for-2018-f01a283a5727

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章