OverView
從技術的角度來看,可視化技術與傳統的前端技術(React / Vue)是兩個完全不同的方向,但在我們日常開發實踐中,其實是會相互用到的。比如我們做任何的項目,多少都會有遇到對應配套的Admin類型的管理系統,對終端進行管理,其中大概率會有的一個模版就是Dashboard,會有圖表內容,進行數據展示,這也就是用到了可視化的技術,例如 EChart,來進行Dashboard內容的繪制。
前端技術與可視化.png
可視化領域的工具
-
圖表庫
繪制大量的圖表,比如,柱狀圖、折線圖、餅圖
ChartJS
ChartJS.png -
地理庫
一座城市的交通線路和建筑物三維模型,或者一個園區的立體建筑模型等等,我們可能要依賴專業的 GIS 地圖庫
Mapbox
Mapbox.png
deck.gl.png
- 渲染庫
2D:
SpriteJS
SpriteJs.png
demo.png
- 數據驅動框架
專注于處理數據的組織形式,而將數據呈現交給更底層的圖形系統(DOM、SVG、Canvas)或通用圖形庫(SpriteJS、ThreeJS)去完成。
D3.js
個人理解,是一種專注于3D抽象數據,通過數據構成,形成圖形。