史金昊，張曉涵，宋沛林

(山東科技大學(xué)測(cè)繪與空間信息學(xué)院，山東 青島 266590)

我國(guó)現(xiàn)有水庫(kù)9.8萬(wàn)多座，這些水庫(kù)在防洪、供水、灌溉和發(fā)電等方面發(fā)揮著重要作用。如何實(shí)現(xiàn)水庫(kù)的科學(xué)、安全、信息化管理成為當(dāng)前的迫切需求。互聯(lián)網(wǎng)、地理信息系統(tǒng)、計(jì)算機(jī)等技術(shù)的不斷發(fā)展，使其在工程領(lǐng)域的應(yīng)用也逐漸普及，水庫(kù)信息可視化系統(tǒng)成為解決水庫(kù)信息科學(xué)管理及展示的新途徑[1]。水利工程管理信息化是國(guó)家水利信息化建設(shè)的重要組成部分，水庫(kù)信息化的建設(shè)中與GIS相結(jié)合[2]，構(gòu)建水庫(kù)信息可視化管理系統(tǒng)，是水庫(kù)管理信息化的重要舉措，是提升水庫(kù)現(xiàn)代信息化管理水平的必然趨勢(shì)[3]。

王淑偉[4]設(shè)計(jì)了遼寧省大中型水庫(kù)移民管理信息系統(tǒng)，實(shí)現(xiàn)水庫(kù)移民信息“一張圖”管理。陳述平等[5]結(jié)合GIS技術(shù)、數(shù)據(jù)挖掘技術(shù)設(shè)計(jì)了大壩運(yùn)行安全監(jiān)測(cè)管理信息系統(tǒng)，實(shí)現(xiàn)安全監(jiān)測(cè)數(shù)據(jù)的采集、評(píng)價(jià)等統(tǒng)一管理。左文娜等[6]通過(guò)ArcGIS Server設(shè)計(jì)了水利信息管理與服務(wù)系統(tǒng)，實(shí)現(xiàn)了水利專(zhuān)題地理數(shù)據(jù)“一張圖”管理，提高了空間數(shù)據(jù)的可利用性。但這些水庫(kù)管理系統(tǒng)絕大多數(shù)是針對(duì)數(shù)據(jù)的管理，往往只是采用C/S端模式開(kāi)發(fā)，采用二維地圖引擎，可視化程度不夠，無(wú)法直觀表達(dá)水庫(kù)真實(shí)情況。雖然現(xiàn)階段已有學(xué)者結(jié)合GIS研發(fā)水庫(kù)相關(guān)的管理系統(tǒng)，但是應(yīng)用多基于商業(yè)GIS平臺(tái)，存在體系龐大、啟動(dòng)速度慢、部署復(fù)雜且成本高昂的不足，不適用于輕量級(jí)行業(yè)的發(fā)展需要。隨著科技的進(jìn)步，基于Web的三維GIS技術(shù)逐漸興起并迅速成為研究熱點(diǎn)[7]。Cesium是開(kāi)源三維地圖引擎的JavaScript庫(kù)，具有跨平臺(tái)、跨瀏覽器等特點(diǎn)，有效降低了成本、提高開(kāi)發(fā)效率，適用于輕量級(jí)應(yīng)用場(chǎng)景[8- 10]。本文針對(duì)以往水庫(kù)信息化系統(tǒng)存在的問(wèn)題，設(shè)計(jì)開(kāi)發(fā)了三維水庫(kù)信息可視化系統(tǒng)，結(jié)合WebGIS、傾斜攝影模型和多種物聯(lián)設(shè)備統(tǒng)計(jì)數(shù)據(jù)，采用Cesium作為三維地圖引擎，以SpringBoot+Vue為框架，將系統(tǒng)的諸要素網(wǎng)絡(luò)化和可視化，用模型評(píng)價(jià)、分析、預(yù)測(cè)水庫(kù)的運(yùn)行[11]，構(gòu)建一個(gè)輕量級(jí)、功能強(qiáng)大的三維水庫(kù)信息可視化系統(tǒng)，實(shí)現(xiàn)了水庫(kù)設(shè)施和水庫(kù)信息的可視化管理。

1 系統(tǒng)設(shè)計(jì)

1.1 系統(tǒng)總體架構(gòu)

水庫(kù)設(shè)施和水庫(kù)信息的可視化管理系統(tǒng)包含三維可視化平臺(tái)和數(shù)據(jù)監(jiān)控中心兩個(gè)子系統(tǒng)。整體系統(tǒng)采用B/S架構(gòu)模式進(jìn)行研發(fā)，總體架構(gòu)采用數(shù)據(jù)層、服務(wù)層和應(yīng)用層架構(gòu)體系，如圖1所示。系統(tǒng)以統(tǒng)一設(shè)計(jì)、分層式架構(gòu)、前后端分離思路進(jìn)行程序開(kāi)發(fā)和部署。在系統(tǒng)開(kāi)發(fā)中，采用相關(guān)的技術(shù)規(guī)范和標(biāo)準(zhǔn)來(lái)支持系統(tǒng)的安全、運(yùn)行和維護(hù)，并且具有良好的可擴(kuò)展性和兼容性的設(shè)計(jì)理念。

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

由于水庫(kù)管理的多樣性、流域地理位置和水資源項(xiàng)目管理模式的差異，需要系統(tǒng)架構(gòu)來(lái)滿(mǎn)足業(yè)務(wù)的多樣化需求。系統(tǒng)綜合運(yùn)用GIS、三維場(chǎng)景及現(xiàn)代網(wǎng)絡(luò)技術(shù)，對(duì)水庫(kù)基礎(chǔ)信息、水質(zhì)水情數(shù)據(jù)、空間地理信息數(shù)據(jù)和多種物聯(lián)監(jiān)測(cè)設(shè)備的實(shí)時(shí)數(shù)據(jù)等多樣性信息進(jìn)行存儲(chǔ)、動(dòng)態(tài)可視化展示、綜合監(jiān)管，構(gòu)建基于WebGIS三維水庫(kù)信息可視化系統(tǒng)，通過(guò)構(gòu)建針對(duì)不同業(yè)務(wù)部門(mén)的相關(guān)數(shù)據(jù)庫(kù)，實(shí)現(xiàn)水庫(kù)各類(lèi)屬性信息及空間數(shù)據(jù)在三維場(chǎng)景中的可視化查閱、分析和決策。

1.2 功能設(shè)計(jì)

根據(jù)三維水庫(kù)信息可視化系統(tǒng)的建設(shè)目標(biāo)和設(shè)計(jì)理念，系統(tǒng)分為三維可視化和數(shù)據(jù)監(jiān)控中心兩個(gè)子系統(tǒng)。三維可視化子系統(tǒng)包含三維數(shù)據(jù)的加載展示、基本GIS功能、查詢(xún)功能、分析功能四個(gè)功能模塊。數(shù)據(jù)監(jiān)測(cè)中心用于多種監(jiān)測(cè)設(shè)備實(shí)時(shí)數(shù)據(jù)的可視化與統(tǒng)計(jì)分析，如水位計(jì)監(jiān)控、攝像頭監(jiān)控、洪澇趨勢(shì)分析、設(shè)備運(yùn)行狀態(tài)監(jiān)控等，具體功能如圖2所示。

圖2 功能模塊

(1)三維可視化子系統(tǒng)

三維可視化子系統(tǒng)主要用于水庫(kù)三維效果及基本信息的可視化展示，具體功能模塊如下：

①三維數(shù)據(jù)加載模塊主要包含三維場(chǎng)景搭建和傾斜攝影模型加載。通過(guò)場(chǎng)景搭建和傾斜攝影模型的結(jié)合可以還原真實(shí)水庫(kù)的三維外貌。

②基本GIS功能模塊主要包含基本的底圖切換、圖層控制、三維坐標(biāo)信息查詢(xún)、空間量測(cè)等功能。其不同于二維地圖的量測(cè)功能，三維地圖在搭建三維場(chǎng)景后，三維的量測(cè)可以貼合真實(shí)地形進(jìn)行量測(cè)，會(huì)極大提升量測(cè)功能的準(zhǔn)確性。

③查詢(xún)功能模塊主要包含空間信息查詢(xún)和屬性信息查詢(xún)。采用地圖獲取和手動(dòng)輸入兩種方式查詢(xún)，并顯示系統(tǒng)所有的水庫(kù)地理位置信息和其內(nèi)的基本信息和詳細(xì)信息。

④分析功能模塊主要包含淹沒(méi)分析和水閘仿真模擬。通過(guò)三維水庫(kù)信息可視化系統(tǒng)真實(shí)模擬洪水淹沒(méi)過(guò)程和水閘放水過(guò)程，可以有效的解決現(xiàn)階段水庫(kù)存在的防汛問(wèn)題，為規(guī)劃下一步?jīng)Q策方案提供有效依據(jù)。

(2)數(shù)據(jù)監(jiān)管中心子系統(tǒng)

數(shù)據(jù)監(jiān)管中心子系統(tǒng)主要包含水庫(kù)內(nèi)部的業(yè)務(wù)管理可視化展示和實(shí)時(shí)監(jiān)測(cè)，將物聯(lián)監(jiān)測(cè)設(shè)備的數(shù)據(jù)通過(guò)數(shù)據(jù)庫(kù)的訪(fǎng)問(wèn)以可視化的形式展現(xiàn)出來(lái)，如水庫(kù)的水質(zhì)監(jiān)測(cè)情況、水位監(jiān)測(cè)情況、視頻監(jiān)控情況、設(shè)備運(yùn)行狀態(tài)、巡檢任務(wù)完成信息和值班排班情況等。方便水庫(kù)業(yè)務(wù)上的管理和信息展示，提升水庫(kù)整體的信息化和數(shù)據(jù)化。

1.3 開(kāi)發(fā)工具及環(huán)境

為了提高整體的開(kāi)發(fā)效率和便于后期的運(yùn)行維護(hù)，系統(tǒng)整體采用前后端分離的開(kāi)發(fā)模式。前端基于WebGIS三維引擎Cesium和二維地圖Leaflet兩種開(kāi)源JavaScript庫(kù)作為本系統(tǒng)的地圖開(kāi)發(fā)技術(shù)引擎，并且采用組件化開(kāi)發(fā)的思路[12]，使用Vue框架，WebStorm進(jìn)行編碼，采用Tomcat作為Web服務(wù)器，網(wǎng)頁(yè)采用HTML5+CSS3進(jìn)行編寫(xiě)，使用JavaScript腳本語(yǔ)言，結(jié)合LayUI和BootStrap兩種UI組件庫(kù)，使用Echarts實(shí)現(xiàn)油樣信息的查詢(xún)與統(tǒng)計(jì)繪圖的功能。后端采用當(dāng)下流行的Spring Boot框架，并應(yīng)用JSON格式對(duì)前后端交互的數(shù)據(jù)進(jìn)行封裝，應(yīng)用Redis進(jìn)行數(shù)據(jù)緩存。數(shù)據(jù)庫(kù)方面采用PostGIS空間數(shù)據(jù)引擎將空間數(shù)據(jù)和屬性數(shù)據(jù)統(tǒng)一存儲(chǔ)至關(guān)系數(shù)據(jù)庫(kù)PostgreSQL中。

2 系統(tǒng)實(shí)現(xiàn)思路及關(guān)鍵技術(shù)

2.1 地形及影像加載實(shí)現(xiàn)

系統(tǒng)支持多種地形格式和服務(wù)，根據(jù)Cesium提供的兩種加載地形數(shù)據(jù)的方式，一個(gè)為STK World Terrain，是一種基于mesh的高分辨率地形數(shù)據(jù)；另一個(gè)為Small Terrain，是一種基于heightmap的中等高分辨率地形數(shù)據(jù)，該方式的地形渲染效果不及第一種，多用于小區(qū)域范圍內(nèi)地形制作需求。本研究方案采用STK World Terrain地形數(shù)據(jù)，這種地形數(shù)據(jù)多用于大面積區(qū)域。

通過(guò)三維地形建模可以清晰地看出影像疊加DEM高程數(shù)據(jù)而產(chǎn)生地形的起伏變化?？紤]到地圖服務(wù)的穩(wěn)定性，系統(tǒng)采用離線(xiàn)地圖的方式加載地形數(shù)據(jù)和影像地圖。通過(guò)地理空間數(shù)據(jù)云網(wǎng)站獲取影像數(shù)據(jù)和DEM數(shù)據(jù)，進(jìn)一步將獲取的數(shù)據(jù)處理成數(shù)據(jù)切片，并將切片發(fā)布到tomcat服務(wù)器，分別利用CesiumTerrainProvider函數(shù)和UrlTemplateImageryProvider函數(shù)調(diào)用并加載地形數(shù)據(jù)和影像地圖，形成帶有起伏的三維地形。

2.2 傾斜攝影模型加載

傾斜攝影相片[13]是指由一定傾斜角的航攝像機(jī)所獲取的影像數(shù)據(jù)，在同一個(gè)飛行平臺(tái)涉及多個(gè)傳感器，從垂直方向、傾斜度等多種不同角度采集圖像時(shí)，可以獲得更完整、準(zhǔn)確的地面目標(biāo)空間信息。然后，通過(guò)幾何校正、平差計(jì)算和多角度圖像匹配，最終可以獲得嵌入精確地理坐標(biāo)且具有真實(shí)空間地理信息的三維空間模型。

Cesium支持加載3D Tiles格式的模型。該格式是目前三維數(shù)據(jù)模型的一種格式標(biāo)準(zhǔn)，主要優(yōu)勢(shì)在于具有高效的Web傳輸和解析特點(diǎn)，提升了運(yùn)行效率和可視化效果。3DTiles格式將大量?jī)A斜的3D數(shù)據(jù)以分塊、分級(jí)渲染的形式組織起來(lái)，可以大大減輕服務(wù)器和GPU的負(fù)擔(dān)，是一種格式公開(kāi)、設(shè)計(jì)優(yōu)秀的WebGIS平臺(tái)三維數(shù)據(jù)展示格式[14]。再將模型數(shù)據(jù)發(fā)布至服務(wù)器端以供Cesium的調(diào)用。傾斜攝影模型加載效果如圖3所示。

圖3 傾斜攝影模型加載

2.3 淹沒(méi)分析方法實(shí)現(xiàn)

由于洪水的流向具有不可控性，淹沒(méi)分析的計(jì)算過(guò)程中要涉及到地表徑流、空間連通性等諸多因素，計(jì)算過(guò)程較為復(fù)雜。本文采取種子點(diǎn)蔓延算法，該算法是先通過(guò)確立分析范圍內(nèi)的種子點(diǎn)，然后以種子點(diǎn)作為水域蔓延的中心區(qū)域，是一種基于空間特征的擴(kuò)散探測(cè)算法[15]。如圖4所示，水流將會(huì)從種子點(diǎn)向周?chē)?面(四項(xiàng)連通)或8面(八項(xiàng)連通)方向進(jìn)行擴(kuò)張，如果水位的高度值高于蔓延位置的高程值則該蔓延位置將處于淹沒(méi)區(qū)，反之，該位置將處于非淹沒(méi)區(qū)，功能效果如圖5所示。

圖4 種子點(diǎn)蔓延算法示意圖

圖5 淹沒(méi)分析實(shí)現(xiàn)

種子點(diǎn)蔓延算法優(yōu)勢(shì)在于可結(jié)合三維地形數(shù)據(jù)，以實(shí)際的地域地形自動(dòng)計(jì)算并提取淹沒(méi)的分析范圍。但是該方法并不適用于數(shù)據(jù)量過(guò)大的計(jì)算過(guò)程，原因在于該算法在過(guò)程中包含大量的遞歸操作，降低了算法的執(zhí)行效率和運(yùn)行速度，并且易出現(xiàn)內(nèi)存泄漏或堆棧溢出等問(wèn)題。所以本文先規(guī)劃設(shè)計(jì)淹沒(méi)區(qū)域，這樣可以有效的避免出現(xiàn)大量的遞歸過(guò)程，大大增加了分析的效率。

同時(shí)傾斜攝影模型完全架構(gòu)于系統(tǒng)平臺(tái)上，將傾斜模型、三維場(chǎng)景和空間信息數(shù)據(jù)無(wú)縫銜接，在系統(tǒng)平臺(tái)上動(dòng)態(tài)展示不同時(shí)刻、區(qū)域、水深、流速等的淹沒(méi)可視化結(jié)果。通過(guò)淹沒(méi)動(dòng)態(tài)仿真展示，可獲取淹沒(méi)分析過(guò)程中的水位變化、流速、流向等重要信息，為防汛規(guī)劃提供直觀、準(zhǔn)確的決策依據(jù)。

2.4 水閘放水模擬實(shí)現(xiàn)

系統(tǒng)的動(dòng)態(tài)水閘放水模擬模塊是采用粒子系統(tǒng)實(shí)現(xiàn)。粒子系統(tǒng)是一種圖形技術(shù)，可以用來(lái)模擬復(fù)雜的物理效果。粒子系統(tǒng)是由許多很小的圖片集合而成，這些圖形結(jié)合會(huì)形成一個(gè)更復(fù)雜的“模糊”物體，就像火焰、天氣、水等。這些復(fù)雜效果則是通過(guò)控制每一個(gè)獨(dú)立粒子的開(kāi)始位置、速度、生命周期等屬性來(lái)完成。

通過(guò)Cesium創(chuàng)建 ParticleSystem類(lèi)的對(duì)象，調(diào)整每個(gè)粒子的樣式、大小、方向等參數(shù)，并根據(jù)水閘模型的位置計(jì)算出粒子系統(tǒng)的三維坐標(biāo)和放置角度并加載到三維地圖中，結(jié)合時(shí)間線(xiàn)控制粒子的生命周期實(shí)現(xiàn)水閘放水動(dòng)態(tài)模擬的過(guò)程，效果如圖6所示。

圖6 水閘放水模擬實(shí)現(xiàn)

2.5 數(shù)據(jù)監(jiān)控中心實(shí)現(xiàn)

數(shù)據(jù)監(jiān)控中心子系統(tǒng)包含對(duì)水庫(kù)基本信息、水質(zhì)水情信息和多種物聯(lián)設(shè)備的監(jiān)測(cè)信息等進(jìn)行數(shù)據(jù)可視化展示，如圖7所示。前端頁(yè)面間數(shù)據(jù)交互采用VueX，使用Axios進(jìn)行后端的數(shù)據(jù)通信和微服務(wù)調(diào)用，服務(wù)器接收請(qǐng)求后根據(jù)請(qǐng)求的邏輯查詢(xún)數(shù)據(jù)庫(kù)，并將查詢(xún)后的數(shù)據(jù)返回至前端頁(yè)面。

圖7 水閘放水模擬實(shí)現(xiàn)

2.5.1動(dòng)態(tài)圖表信息

系統(tǒng)采用Echarts進(jìn)行動(dòng)態(tài)圖表信息的可視化展示。Echarts是一個(gè)開(kāi)源的數(shù)據(jù)可視化工具，能夠與多種數(shù)據(jù)源集成，根據(jù)需求定制各種的可視化圖表，同時(shí)有良好的兼容性，現(xiàn)階段絕大部分瀏覽器都完美兼容Echarts，也是當(dāng)下各種圖表數(shù)據(jù)可視化工具中非常主流的數(shù)據(jù)可視化工具。通過(guò)前端向后端發(fā)送請(qǐng)求，將獲取的請(qǐng)求數(shù)據(jù)信息以可視化圖表的形式渲染在頁(yè)面中進(jìn)行可視化操作。

2.5.2地圖區(qū)域概覽

數(shù)據(jù)監(jiān)控中心子系統(tǒng)的地圖區(qū)域概覽模塊利用Leaflet實(shí)現(xiàn)二維地圖的可視化。Leaflet是一個(gè)輕量級(jí)的開(kāi)源JS地圖組件，具有上手容易、性能優(yōu)越等優(yōu)勢(shì)[16]。地圖區(qū)域概覽模塊提供了二維地圖的視角預(yù)覽水庫(kù)的位置信息及設(shè)備信息。

2.5.3實(shí)時(shí)視頻監(jiān)控

數(shù)據(jù)監(jiān)控中心子系統(tǒng)的視頻實(shí)時(shí)監(jiān)控模塊采用HLS(HTTP Live Streaming)協(xié)議加載視頻流媒體。隨著通信技術(shù)的發(fā)展，設(shè)備硬件及通訊專(zhuān)線(xiàn)建設(shè)的成本也大幅降低，實(shí)時(shí)監(jiān)控對(duì)于水庫(kù)信息化建設(shè)尤為重要。

現(xiàn)階段實(shí)時(shí)監(jiān)控主流的視頻傳輸協(xié)議是RTSP協(xié)議，國(guó)內(nèi)多數(shù)攝像頭硬件廠(chǎng)商，如海康、大華等，均使用該協(xié)議。但是RTSP協(xié)議是無(wú)法直接通過(guò)瀏覽器顯示，需要安裝瀏覽器插件播放，這也帶來(lái)了極大的不便。為解決上述問(wèn)題，本研究通過(guò)將實(shí)時(shí)監(jiān)控的視頻流上傳至流媒體服務(wù)器的方式處理監(jiān)控視頻，通過(guò)流媒體服務(wù)器的處理可將RTSP協(xié)議轉(zhuǎn)換成HLS協(xié)議，方便了網(wǎng)頁(yè)直接播放視頻監(jiān)控。

3 結(jié)語(yǔ)

本文利用水庫(kù)流域GIS模型、傾斜攝影模型和多種物聯(lián)設(shè)備統(tǒng)計(jì)數(shù)據(jù)，從系統(tǒng)體系架構(gòu)、框架設(shè)計(jì)等方面詳細(xì)闡述了基于WebGIS的三維水庫(kù)信息可視化系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)。系統(tǒng)綜合運(yùn)用WebGIS、空間數(shù)據(jù)庫(kù)、Internet及三維仿真模擬等高新技術(shù)，整合并利用水利信息資源，實(shí)現(xiàn)了三維展示、多源物聯(lián)設(shè)備的數(shù)據(jù)監(jiān)視、洪澇預(yù)警和仿真模擬等功能，為水利工程各類(lèi)信息資源的共享與統(tǒng)一管理提供有力的支撐。系統(tǒng)可快速移植并應(yīng)用到各個(gè)水庫(kù)，為水庫(kù)信息化管理、水庫(kù)流域防洪決策等方面提供有效的決策依據(jù)。