HTML5中新的圖形元素和JavaScript引發了互動式資料顯示技術的復興。如今的瀏覽器使用者介面不僅功能豐富、令人賞心悅目,而且還作為資料視覺化的載體,用於顯示柱狀體、氣泡圖和豐富多彩的地圖等。
互動式資料視覺化在很大程度上取決於JavaScript庫的任務能力。在這篇文章中,我們將看看四個JavaScript庫:D3,InfoVis,Processing.js,和Recline.js。所有這些庫可以用來裝飾您的網頁與動態資料視覺化,但每個採用不同的方法來提供這種能力。所有四個都可以免費使用和分發。
D3
D3是一種奇妙的基於Javascript的資料視覺化庫,允許您將資料繫結到DOM,然後將資料驅動轉換應用到Document中。你可以使用它用一個陣列建立基本的HMTL表格,或是利用它的流體過度和互動,用相似的資料建立驚人的SVG條形圖。
優點
- 豐富的例項
- 使用標準的DOM物件,容易除錯
- 可通過擴充套件來建立任意資料視覺化
- 可以處理多種資料格式,包括 XML、CSV 和 JSON 等
缺點
- D3 非常強大,因此與其他庫相比,學習成本要多一些
- D3 與早期的 IE 版本不相容
- 需要深入瞭解JavaScript
InfoVis
InfoVis是一個在Web上建立可互動式的資料圖表的JavaScript 庫。InfoVis有點類似Moo工具,它是一個模組化的物件指向型JavaScript架構,通常這些架構都是高階JavaScript程式設計師要藉助的中介。由於它具有模組化的格式,因此使用者可以使用JavaScript InfoVis保持頁面的簡潔。它還包括一個動畫效果功能,多種繪圖型別和一個用於操作JSON資料的類。
優點
- API很容易理解
缺點
- 圖表庫不太靈活
- 不如其他工具那樣易於擴充套件
Processing
Processing.js是一個基於Java圖形系統的JavaScript 庫。它不僅僅提供資料視覺化,還可以實現程式影像、動畫和互動的應用。
優點
- 可用於建立動畫
- 很大程度上相容Processing Java
- 輕量,易於瞭解掌握
缺點
- 需要學習Processing language
Recline.js
Recline.js可以幫助你使用Javascript和html快速地建立基於資料的應用。Recline.js已經內建支援從、CSV files, Google Docs, ElasticSearch, CouchDB等來載入資料。並能夠以表格,地圖,時間線等方式來漂亮地展示資料。展示的方式可以很方便地按自己的需要進行擴充套件。
優點
- 線上練習
- 可與其他JavaScript庫整合
缺點
- 圖表型別有限