基于HTML5的WebGL電信網(wǎng)管3D機(jī)房監(jiān)控應(yīng)用

不是在玩游戲哦，是規(guī)規(guī)矩矩的電信網(wǎng)管企業(yè)應(yīng)用，嗯，全鍵盤的漫游3D機(jī)房:

隨著PC端支持HTML5瀏覽器的普及，加上主流移動終端Android和iOS都已支持HTML5技術(shù)，新一代的電信網(wǎng)管應(yīng)用幾乎一致性的首選HTML5，當(dāng)然Flex和Silverlight的遺留系統(tǒng)依然存活著，如果不考慮移動終端，不考慮將來維護(hù)人員難找，不考慮需要承載成千上萬的網(wǎng)元數(shù)量，不考慮公司員工的職業(yè)生涯前途，哪怕其各自父母adobe和ms都已棄之，其實Flex和Silverlight作為企業(yè)應(yīng)用方案技術(shù)上還是可以的，還是能存活很多很多年。

但我作為程序員可是要考慮自己的職業(yè)生涯的，可能有人喜歡成為能維護(hù)CORBA或IBM大機(jī)那樣的稀有物種得到高薪，我還是喜歡朝氣蓬勃的技術(shù)氛圍，我喜歡每天上Hacker News都能見到討論我從事的技術(shù)的新鮮事，我喜歡有搞通用組件有Sencha和Kendoui可選擇，搞圖表有Highcharts可選擇，搞2D拓?fù)浜?D機(jī)房有Hightopo可選擇，搞移動應(yīng)用有JQuery Mobile可選擇，每周末到徐家匯公園那個照的到太陽看得見湖色幾乎成為我私人定制的木凳，打開平板好好通讀這一周Web前端發(fā)送的一切新鮮事，是的我有JavaScript Weekly、HTML5 Weekly和Modern Web Observer可選擇，我很慶幸自己活在這個HTML5時代，可以用一門javascript語言技術(shù)玩通用組件，玩Chart，玩拓?fù)洌?D，是的還可以玩后臺NodeWeekly，再說了不成為稀缺動物，就玩HTML5不也照樣拿高薪，有選擇的條件下何苦讓自己成為恐龍古董。

回到今天正題，隨著去年后半年來IE11和Android瀏覽器支持WebGL之后，WebGL技術(shù)在我接觸的行業(yè)領(lǐng)域已成燎原之勢。什么？還得考慮支持OA老系統(tǒng)的IE678，Chrome Frame插件早就可以讓IE678910跑WebGL了，更不用說HTML5的2D的Canvas。什么？性能問題，可看看HT for Web 跑數(shù)萬網(wǎng)元的操作體驗視頻。

什么？兼容性問題，這些問題就交給各種框架來解決，HTML5的3D引擎非常多threejs是知名度較高的，但較臃腫大好幾百k的包，什么功能都觸及但都做不深入，動畫引擎像玩具，做游戲引擎又缺碰撞檢測，這點上不及后起之秀babylonjs，最早吸引我的是注意的是介紹babylonjs的這段話 I am a real fan of 3D development. Since I was 16, I spent all my spare time creating 3d engines with various technologies (DirectX, OpenGL, Silverlight 5, pure software, etc.). 這段話老讓我郁悶的回憶自己16歲在干嗎？

我喜歡babylonjs主要因為他專注游戲引擎的定位，同樣企業(yè)應(yīng)用我選擇Hightopo的HT for Web 3D引擎，畢竟企業(yè)應(yīng)用和游戲功能、性能、渲染效果等方面考慮的是不一樣的，沒有一個引擎能解決所有行業(yè)的所有問題，干活還得找最對口的工具，Hightopo的3D引擎包很小，核心3D引擎只有幾十k，融合通用組件和2D的整體包也才200多k，另外HT的整體開發(fā)模式用同一個數(shù)據(jù)模型驅(qū)動了通用組件、2D拓?fù)浣M件包括3D引擎的組件，對于我做企業(yè)應(yīng)用的Tree、Table這些和圖形的聯(lián)動是很重要的事情，這點做游戲的同學(xué)可能體會不到我們這些還得面對一大堆業(yè)務(wù)表格整體CURD同學(xué)的痛苦，另外Hightopo也具備必要的游戲引擎功能，例如全鍵盤導(dǎo)航操作功能，支持Mobile的Touch交互功能，基本的Collisions Detection碰撞檢測。最后Hightopo畢竟專注電信行業(yè)，知道電信網(wǎng)管需要什么模塊庫，他能知道我等每天面對ODF/DDF/MDF/Shelf/Card/Port這些電信業(yè)務(wù)模型的痛苦點。見此視頻

使用Hightopo還有很重要的一點就是HT提供了基于HTML5的可視化設(shè)計器，無需借助3ds max和maya這樣的專業(yè)3D設(shè)計工具，直接HT 3D Designer通過頁面就能進(jìn)行3D建模，而動態(tài)的數(shù)據(jù)部分通過API的方式驅(qū)動生成模型和實時更新即可，最近的這些項目我們團(tuán)隊不需要美工都能完全由我們程序員自己搞定，當(dāng)然要做漂亮貼圖部分還是需要美工ps的幫助。

就像電信OSS和BSS越來越難清晰定界一樣，2D和3D的應(yīng)用也會如此，越來越模糊，一個系統(tǒng)將2D和3D融合是必然趨勢，你中有我我中有你，也許將來我這個文章標(biāo)題會讓人覺得搞笑，機(jī)房監(jiān)控當(dāng)然要有3D功能了，何必強(qiáng)調(diào)3D，沒有3D還算是機(jī)房監(jiān)控嗎，好比今天的手機(jī)，不能上網(wǎng)還算手機(jī)嗎？

當(dāng)然Flex、Silverlight還有很多采用Activex的C++引擎也都可以在Web上跑3D的引擎可以支持，但誰能忽視mobile呢，這些年大家受夠了Web開發(fā)千奇百怪的大雜燴解決方案，每次到運(yùn)營商客戶運(yùn)維終端看到古老的IE里面跑著各種插件糅合的脆弱系統(tǒng)，各種OA廠家還自鳴得意的支持IE678，還有不少人拿著facebook從html5遷移到native說事，其一那都是過去式了，其二那不是企業(yè)應(yīng)用，Mark Zuckerberg需要的東西和做企業(yè)應(yīng)用的你我是不一樣的東西，下一個時代的企業(yè)應(yīng)用技術(shù)必將是清清爽爽的HTML5！

當(dāng)然3D不是電信網(wǎng)管的專注，以下是我們另一個部門做的太陽能發(fā)電、燃?xì)夂椭悄芗揖有袠I(yè)的3D監(jiān)控系統(tǒng)應(yīng)用供參考：

來源：機(jī)房監(jiān)控 http://www.dr4xxf.cn   本文采集于網(wǎng)絡(luò)，如有問題有聯(lián)系刪除