天天看點

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

3d庫房,3d檔案室,3d密集架,webGL,threejs,3d機房

閑話少叙,我們接着第一課繼續講(http://www.cnblogs.com/yeyunfei/p/7899613.html),很久沒有做技術分享了。很多人問第二課有沒有,我也是抽空寫一下第二課。

第一課程提到了在庫房的基礎上添加上下架 消防 溫濕度等等控制

剛好 最近有接到一個客戶的需求 是和庫房差不多的項目 隻是不是庫房了 是檔案室 但是基本操控還是差不多的 也有檔案上下架什麼的

那麼第二課  我們就按照客戶的需求 先做一個概述性的展現 

特此說明:為了減少網絡傳輸帶寬 我特意用ScreenToGif工具 截了一些gif圖 壓縮成低幀率

技術交流 [email protected]

交流微信:

    

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

如果你有什麼要交流的心得 可郵件我

一、需要場景進行無縫的動畫切換

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

 代碼實作

  

 二、打開密集架 有過度動畫

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

  代碼實作

 三、對密集架的檔案檔案進行上下架操作 保留操作接口

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

四、快速檢索檔案,并定位

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

五、場景内監控攝像頭 調取實時視訊

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

六、消防滅火器快速定位 查找

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

七、實時3D模拟消防火警 顯示火災參考情況

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

八、場景内溫度調節 并且有調節動畫 

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

九 、場景内濕度調節 有調節動畫

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

 十、對場景内資料大屏 進行操控 螢幕切換

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

十一、對場景内通風系統進行3D操作 并且有過度動畫

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

 十二、對場景内空調 中央空調進行3D操作 并且有過度動畫

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

十三、打開3D場景内告警監控,3D實時模拟顯示告警情況

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

十四、對場景内其它裝置進行3D操控 如窗簾 采光控制 燈光控制等等

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

好了 這一課基本情況就先介紹到這裡 

下一課我們繼續講解這一課的代碼詳情 以及讨論給這個場景加上一些新的功能 或者建立其他3D場景

用webgl 建立 3D機房 3D園區 3D智慧小區 3D工程等等

如何用webgl(three.js)搭建一個3D庫房,3D密集架,3D檔案室,-第二課

繼續閱讀