基于Three.js 的鐵路數(shù)據(jù)中心運(yùn)維數(shù)據(jù)可視化系統(tǒng)設(shè)計(jì)

樂建煒，孫遠(yuǎn)運(yùn)，宋燕蓉，喬晶鑫，春 玲

（1.中國鐵路信息科技集團(tuán)有限公司，北京 100844；2.中國國家鐵路集團(tuán)有限公司 科技與信息化部，北京 100844；3.中鐵信弘遠(yuǎn)（北京）軟件科技有限責(zé)任公司，北京 100038）

隨著鐵路信息化事業(yè)的不斷發(fā)展，中國國家鐵路集團(tuán)有限公司（簡稱：國鐵集團(tuán)）和各鐵路局集團(tuán)公司數(shù)據(jù)中心的設(shè)備及應(yīng)用的數(shù)量快速增長，運(yùn)維工作范圍和工作量迅速增加，現(xiàn)有的運(yùn)維監(jiān)控系統(tǒng)逐漸暴露出監(jiān)控功能單一、信息共享不及時(shí)、可視化程度低的弊端，越來越無法滿足鐵路數(shù)據(jù)中心運(yùn)維工作的需求。

國內(nèi)關(guān)于數(shù)據(jù)可視化技術(shù)的研究已取得不少成果，秦鵬針對既往運(yùn)維可視化系統(tǒng)、監(jiān)控系統(tǒng)的構(gòu)造及設(shè)備管理和維護(hù)功能存在的問題提出了優(yōu)化措施，闡明了三維機(jī)房運(yùn)維可視化系統(tǒng)的設(shè)計(jì)和構(gòu)造思路[1]；龔昊等人提出利用二維、三維的圖形交互展示來提高用戶對海量數(shù)據(jù)的直觀理解，為數(shù)據(jù)管理提供便利[2]；閆海濤等人設(shè)計(jì)了一種電力三維可視化系統(tǒng)，用于電力設(shè)備及周邊環(huán)境三維模型的創(chuàng)建及展示[3]；高齊琦等人提出基于Three.js 引擎的磁盤陣列三維可視化的框架，以此來創(chuàng)建真實(shí)的三維場景，給用戶帶來流暢豐富的視覺及交互體驗(yàn)[4]；張玄等人提出利用Three.js 特有的JSON 模型文件格式來加強(qiáng)用戶與系統(tǒng)的交互，以此提高管理效率[5]；余莉利用Three.js 的特性，實(shí)現(xiàn)了組合模型、外部導(dǎo)入模型的拾取及多對象拾取等特殊應(yīng)用，基本滿足了虛擬場景的交互需求[6]；馮姣等人利用WebGL（Web Graphics Library）構(gòu)建了數(shù)據(jù)驅(qū)動(dòng)的三維飛行可視化系統(tǒng)，利用氣動(dòng)數(shù)據(jù)驅(qū)動(dòng)，實(shí)時(shí)模擬飛行器運(yùn)動(dòng)軌跡，增加仿真效果真實(shí)性[7]；趙海鵬等人利用傾斜攝影測量、Three.js、四叉樹索引數(shù)據(jù)結(jié)構(gòu)等技術(shù)設(shè)計(jì)了一款虛擬校園系統(tǒng)，較好地解決了模型紋理失真、建模周期長、效率低等問題[8]。

本文針對鐵路數(shù)據(jù)中心運(yùn)維監(jiān)控系統(tǒng)的現(xiàn)狀和存在的問題，設(shè)計(jì)了一種基于Three.js 的運(yùn)維數(shù)據(jù)可視化系統(tǒng)，為數(shù)據(jù)中心運(yùn)維、巡檢、管理人員和用戶提供實(shí)時(shí)、規(guī)范、量化、準(zhǔn)確的運(yùn)維數(shù)據(jù)服務(wù)，對數(shù)據(jù)中心進(jìn)行更準(zhǔn)確、及時(shí)、有效地監(jiān)控、預(yù)警和管理，降低數(shù)據(jù)中心運(yùn)維成本，縮短報(bào)警響應(yīng)處理時(shí)間，提高數(shù)據(jù)中心運(yùn)維效率、安全性和管理水平。

1 系統(tǒng)架構(gòu)

本文設(shè)計(jì)的數(shù)據(jù)可視化系統(tǒng)架構(gòu)如圖1 所示，包括數(shù)據(jù)層、處理層、應(yīng)用層。數(shù)據(jù)層通過接口集成鐵路數(shù)據(jù)中心現(xiàn)有應(yīng)用監(jiān)控?cái)?shù)據(jù)、數(shù)據(jù)中心基礎(chǔ)設(shè)施管理系統(tǒng)（DCIM，Data Center Infrastructure Management）數(shù)據(jù)、智能巡檢數(shù)據(jù)，數(shù)據(jù)來源包括運(yùn)維支撐平臺(tái)、鐵路云平臺(tái)、視頻監(jiān)控系統(tǒng)、動(dòng)力環(huán)境監(jiān)控系統(tǒng)（簡稱：動(dòng)環(huán)監(jiān)控系統(tǒng)）、樓宇自動(dòng)化（BA，Building Automation）系統(tǒng)、移動(dòng)巡檢系統(tǒng)和機(jī)器人巡檢系統(tǒng)等；在處理層對運(yùn)維數(shù)據(jù)進(jìn)行數(shù)據(jù)分類、數(shù)據(jù)格式統(tǒng)一和數(shù)據(jù)加工，確定各種報(bào)警閾值并定時(shí)同步更新，實(shí)現(xiàn)對各類運(yùn)維數(shù)據(jù)的實(shí)時(shí)統(tǒng)計(jì)分析；在應(yīng)用層通過Three.js 三維引擎，將數(shù)據(jù)與三維展示環(huán)境中的場景、模型、標(biāo)簽等進(jìn)行關(guān)聯(lián)，實(shí)現(xiàn)各種運(yùn)維信息可視化,從而對數(shù)據(jù)中心進(jìn)行整體監(jiān)控。

圖1 系統(tǒng)架構(gòu)

2 系統(tǒng)功能

系統(tǒng)包括5 個(gè)功能模塊：基礎(chǔ)設(shè)施可視化，應(yīng)用監(jiān)控可視化，容量管理可視化，網(wǎng)絡(luò)管理監(jiān)控可視化（簡稱：網(wǎng)管監(jiān)控可視化）和動(dòng)環(huán)監(jiān)控可視化，如圖2 所示。

圖2 系統(tǒng)功能

2.1 基礎(chǔ)設(shè)施可視化

包括機(jī)房可視化、機(jī)柜可視化和設(shè)備可視化，通過三維圖形和列表的形式展示機(jī)房、機(jī)柜和設(shè)備的詳細(xì)信息，管理員可對其進(jìn)行增加、刪除、修改、查詢和統(tǒng)計(jì)分析等操作。

用戶可根據(jù)數(shù)據(jù)中心樓層、機(jī)房、設(shè)備編號等進(jìn)行查詢。系統(tǒng)可顯示設(shè)備對應(yīng)的機(jī)房、機(jī)柜和單元位置，通過點(diǎn)擊機(jī)柜標(biāo)簽，可顯示機(jī)柜詳細(xì)信息及其所有服務(wù)器的位置標(biāo)識(shí)框，點(diǎn)擊標(biāo)識(shí)框后可顯示服務(wù)器的詳細(xì)信息。

2.2 應(yīng)用監(jiān)控可視化

負(fù)責(zé)接收鐵路應(yīng)用運(yùn)維監(jiān)控類系統(tǒng)的監(jiān)控和報(bào)警信息，經(jīng)處理之后在機(jī)房和機(jī)柜場景中進(jìn)行可視化展示。數(shù)據(jù)來源包括運(yùn)維支撐平臺(tái)、鐵路云平臺(tái)及其他應(yīng)用級監(jiān)控系統(tǒng)。

2.3 容量管理可視化

此功能包括空間統(tǒng)計(jì)、功率統(tǒng)計(jì)、承重統(tǒng)計(jì)和機(jī)位統(tǒng)計(jì)。

（1）空間統(tǒng)計(jì)：系統(tǒng)可在三維可視化環(huán)境中展示機(jī)房、機(jī)柜空間容量的分布統(tǒng)計(jì)，根據(jù)不同的顏色區(qū)分機(jī)柜的單元位置使用情況；支持對機(jī)房、機(jī)柜空間的分布圖可視化渲染表現(xiàn)，同時(shí)，支持通過鼠標(biāo)移動(dòng)和轉(zhuǎn)動(dòng)模型。

（2）功率統(tǒng)計(jì)：系統(tǒng)可在三維可視化環(huán)境中展示機(jī)房、機(jī)柜額定功率分布統(tǒng)計(jì)，或在其上方展示該機(jī)房的總功率和使用率，支持對機(jī)房、機(jī)柜功率分布圖的可視化渲染，也支持通過鼠標(biāo)，移動(dòng)或轉(zhuǎn)動(dòng)模型，如圖3 所示。

圖3 容量管理可視化功能

（3）承重統(tǒng)計(jì)：系統(tǒng)可在三維可視化環(huán)境中展示機(jī)房承重分布情況統(tǒng)計(jì)，能夠以柱狀圖的方式直觀的展現(xiàn)當(dāng)前機(jī)房中每個(gè)機(jī)柜的承重狀態(tài)，讓用戶實(shí)時(shí)了解機(jī)房布局并進(jìn)行有效調(diào)整。

（4）機(jī)位統(tǒng)計(jì)：系統(tǒng)在三維可視化環(huán)境中展示目前機(jī)房已經(jīng)使用的機(jī)位與剩余機(jī)位情況。

2.4 網(wǎng)管監(jiān)控可視化

包括性能監(jiān)控展示和告警監(jiān)控展示。

（1）性能監(jiān)控展示：用戶點(diǎn)擊機(jī)柜上方的普通標(biāo)簽，可查看該機(jī)房監(jiān)控的性能數(shù)據(jù)信息。

（2）告警監(jiān)控展示：用戶點(diǎn)擊機(jī)柜上方的紅色標(biāo)簽，可看到該機(jī)柜的所有告警信息。

2.5 動(dòng)環(huán)監(jiān)控可視化

包括不間斷電源（UPS，Uninterrupted Power Supply）監(jiān)控、溫度云圖、配電柜監(jiān)控和精密空調(diào)監(jiān)控。

（1）UPS 監(jiān)控：系統(tǒng)可展示用戶查詢區(qū)域內(nèi)每個(gè)UPS 的輸入、輸出、電壓、電流、運(yùn)行狀態(tài)等監(jiān)控和告警信息。

（2）溫度云圖：系統(tǒng)可以云圖的方式呈現(xiàn)整個(gè)機(jī)房的溫度、濕度環(huán)境信息。

（3）配電柜監(jiān)控：系統(tǒng)可展示用戶查詢區(qū)域內(nèi)每個(gè)配電柜的輸入、輸出、電壓、電流、運(yùn)行狀態(tài)等監(jiān)控和告警信息。

（4）精密空調(diào)監(jiān)控：系統(tǒng)可展示用戶查詢區(qū)域內(nèi)每臺(tái)空調(diào)的溫度、濕度、運(yùn)行狀態(tài)等監(jiān)控和告警信息。

3 關(guān)鍵技術(shù)

3.1 WebGL 技術(shù)與Three.js 引擎

（1）WebGL 技術(shù)

WebGL 是一種基于OpenGL 技術(shù)的3D 繪圖標(biāo)準(zhǔn)，它融合了JavaScript 和OpenGL ES2.0，為HTML5 Canvas 提供了硬件3D 加速渲染。WebGL 能夠運(yùn)行在任何支持Web 的系統(tǒng)中，不需要任何瀏覽器插件的支持，具有良好的兼容性和跨平臺(tái)性。

本文利用WebGL 技術(shù)，借助系統(tǒng)顯卡，可在瀏覽器中流暢地展示中國鐵路主數(shù)據(jù)中心園區(qū)的三維場景和模型，如圖4 所示。

圖4 中國鐵路主數(shù)據(jù)中心園區(qū)模型

（2）Three.js 引擎

在基于WebGL 的三維應(yīng)用開發(fā)中，Three.js 是較為主流的選擇。Three.js 是使用JavaScript 編寫的WebGL 第三方庫，是一款運(yùn)行在瀏覽器中的三維引擎，可以通過它創(chuàng)建各種三維場景。與Unity3D、UE4 等三維圖形引擎相比，Three.js 具有開源免費(fèi)、容易上手、擴(kuò)展性強(qiáng)等特點(diǎn)，且易連接Oracle、MySQL等各類數(shù)據(jù)庫。

Three.js 引擎的基本組件包括場景、攝像機(jī)和渲染器等。場景是用來容納圖形元素的容器，圖形元素只有添加到場景中，其坐標(biāo)、大小才有意義；攝像機(jī)定義可視域，決定場景中哪個(gè)角度的內(nèi)容會(huì)顯示出來；渲染器決定繪制結(jié)果及繪制方式。

本文通過Three.js 加載器加載中國鐵路主數(shù)據(jù)中心園區(qū)、樓層、機(jī)房和機(jī)柜的obj/mtl 模型，使用Three.js 提供的幾何形狀在機(jī)柜模型上繪制服務(wù)器等設(shè)備，便于提高用戶與系統(tǒng)的交互效果。

3.2 機(jī)房溫度云圖繪制

溫度云圖通過聚合溫度數(shù)據(jù)，以漸進(jìn)的色帶展現(xiàn)機(jī)房內(nèi)的溫度分布，在效果上優(yōu)于離散點(diǎn)的直接表示，可更直觀的展示數(shù)據(jù)的疏密程度及溫度的實(shí)時(shí)變化。

在Three.js 引擎中，溫度云圖具有自己的內(nèi)部數(shù)據(jù)存儲(chǔ)區(qū)和渲染器。

（1）創(chuàng)建溫度云圖實(shí)例后，通過調(diào)用setData方法進(jìn)行數(shù)據(jù)的初始化，也可調(diào)用addData 方法動(dòng)態(tài)添加數(shù)據(jù)，實(shí)現(xiàn)數(shù)據(jù)的實(shí)時(shí)變化；

（2）將該方法與Three.js 引擎相結(jié)合，獲取溫度云圖畫布；

（3）通過調(diào)用THREE.PlaneGeometry()、THREE.Mesh()、THREE.Mesh Basic Material()、THREE.Texture()等方法將溫度云圖展示在模型上方。var point={x:100,y:135,value:20,radius:35}，其中，point 代表機(jī)柜；x、y、value 和radius 分別表示機(jī)柜的x軸坐標(biāo)、y軸坐標(biāo)、溫度值和繪制的圓形半徑，通過聚合每個(gè)機(jī)柜的上述信息繪制出整個(gè)機(jī)房的溫度云圖，繪制結(jié)果，如圖5 所示。

圖5 溫度云圖繪制結(jié)果

3.3 三維模型展示和動(dòng)畫效果

實(shí)際運(yùn)用中，Three.js 默認(rèn)的幾何形狀和材質(zhì)比較簡單，不能滿足用戶需求。本文通過對機(jī)房、機(jī)柜的各項(xiàng)參數(shù)進(jìn)行實(shí)際測量，借助3DS Max 等建模軟件還原機(jī)房機(jī)柜的實(shí)際物理位置及尺寸，建模完成后，將其導(dǎo)出為mtl 和obj 的格式模型，并導(dǎo)入系統(tǒng)。

通過三維可視化，可以增強(qiáng)不同種類運(yùn)維數(shù)據(jù)的直觀性、提高運(yùn)維效率。將虛擬場景和真實(shí)數(shù)據(jù)相結(jié)合,為數(shù)據(jù)中心的日常資產(chǎn)管理、工程建設(shè)等提供決策依據(jù)，加強(qiáng)對機(jī)房設(shè)備的監(jiān)控。通過空間分布來展示固定資產(chǎn)位置,提高管理人員的工作效率，如圖6 所示。

圖6 機(jī)房三維模型可視化效果

Three.js 引擎封裝了很多創(chuàng)建幾何體的構(gòu)造函數(shù)，本系統(tǒng)采用BoxGeometry()來創(chuàng)建機(jī)柜內(nèi)的設(shè)備長方體，數(shù)據(jù)結(jié)構(gòu)如下:

其中，sizeX、sizeY、sizeZ 分別表示立方體的長、寬、高；positionX、positionY、positionZ 則對應(yīng)立方體的位置坐標(biāo)，是通過測量實(shí)際設(shè)備的尺寸和位置信息來獲取的。

另外，為提高用戶使用體驗(yàn)，通過調(diào)用Three.js引擎中的THREE.BoxGeometry()、THREE.MeshBasic-Material()、THREE.Mesh()、THREE.BoxHelper()等方法，實(shí)現(xiàn)根據(jù)綠、黃、橙、紅等顏色區(qū)分機(jī)柜功率大小的功能。

3.4 數(shù)據(jù)動(dòng)態(tài)實(shí)時(shí)加載

本系統(tǒng)中的三維模型和數(shù)據(jù)展示均采用了動(dòng)態(tài)加載技術(shù)，根據(jù)需求快速切換不同的模型，即使機(jī)房設(shè)備模型數(shù)量較多，也不會(huì)造成運(yùn)行卡頓。動(dòng)態(tài)實(shí)時(shí)加載技術(shù)的原理是設(shè)置數(shù)據(jù)加載和移除閾值，當(dāng)場景中的攝像機(jī)運(yùn)動(dòng)到一定位置時(shí)，加載該視角中所有的模型，此時(shí)可遍歷該范圍內(nèi)的模型；當(dāng)攝像機(jī)遠(yuǎn)離到一定程度，便移除此視角中的所有模型，循環(huán)往復(fù)直至遍歷結(jié)束。同時(shí)，還可設(shè)置更新時(shí)間，即使三維模型較多，也可清晰、準(zhǔn)確、實(shí)時(shí)查看所選的各項(xiàng)數(shù)據(jù)，保證數(shù)據(jù)可視化的實(shí)時(shí)性和準(zhǔn)確性。

4 結(jié)束語

本文提出的基于Three.js 的鐵路數(shù)據(jù)中心運(yùn)維數(shù)據(jù)可視化系統(tǒng)，可以對鐵路各級數(shù)據(jù)中心的各類運(yùn)維監(jiān)控系統(tǒng)的運(yùn)維數(shù)據(jù)進(jìn)行規(guī)范化、可視化、集中化展示，為數(shù)據(jù)中心對應(yīng)用、設(shè)備、環(huán)境資源進(jìn)行安全高效集中管理提供一種高效、自動(dòng)化、智能化的手段。該系統(tǒng)已在中國鐵路主數(shù)據(jù)中心和國鐵集團(tuán)部分機(jī)房投入使用，實(shí)現(xiàn)了機(jī)房自動(dòng)化巡檢，為鐵路信息機(jī)房及UPS 配電機(jī)房的運(yùn)維工作提供了技術(shù)支持，減少了運(yùn)維人員的工作量，降低了數(shù)據(jù)中心的運(yùn)維成本，是“綠色數(shù)據(jù)中心”概念的一種實(shí)際體現(xiàn)。