Gio.js 是壹個基於Three.js的web 3D地球數據可視化的開源組件庫。使用Gio.js的網頁應用開發者,可以快速地以申明的方式創建自定義的Web3D數據可視化模型,添加數據,並且將其作為壹個組件整合到自己的應用中。
這個庫的開發是受到Google 2012 Info大會上的某項目可視化的啟發,該項目開發者是Google員工Michael Chang。使用Gio.js就可以快速構建這種炫酷的3D模型,並以此為基礎進行深入地開發。
在HTML的<head>中引入Three.js和Gio.js依賴, 以下展示了如何使用<script>標簽引入依賴:
在引入Three.js和Gio.js在頁面之後,已經可以創建3D Gio地球了。在此我們將先展示如何創建基礎樣式的Gio地球。
創建壹個<p>,Gio地球將會被渲染在這個區域中:
添加壹下4行Javascript代碼在妳的HTML中, 用以創建並渲染:
在Gio.js 1.0發布之後,開發者們提出了很多很酷的、很有建設性的建議,比如微信應用開發者希望Gio.js支持微信小程序,有經驗的Three.js開發者希望Gio.js提供Three.js編程接口等。在經過仔細研究、綜合設計之後,Gio.js 2.0實現了大部分功能,並且添加了有關文檔說明。以下列出了主要的2.0新增特性:
Gio.js僅依賴於Three.js。
經過測試,Gio.js在Three.js R90版本下可以很好地運行和使用。
Gio.js可以運行在以下的瀏覽器環境中:
更多詳細的介紹就不在本文中介紹了,官方文檔非常詳細,感興趣的小夥伴可以直接移步文檔:
Gio.js可以說是Three.js中實踐的非常不錯的了,官方還提供了非常多的實例,通過壹些簡單的API配置即可實現非常炫酷的Web3D可視化地球,而且文檔非常詳細,更多實用和有趣的地方等待妳的 探索 !