言

近幾年，我國(guó)智慧城市建設(shè)步伐也不斷加快，黨中央和國(guó)務(wù)院也更加注重智慧園區(qū)的建設(shè)與發(fā)展，智慧園區(qū)建設(shè)與園區(qū)產(chǎn)業(yè)發(fā)展相結(jié)合，向著創(chuàng)新化、生態(tài)化發(fā)展，更加注重高新技術(shù)、綠色環(huán)保型等產(chǎn)業(yè)的發(fā)展，將管理創(chuàng)新與園區(qū)智能化相結(jié)合。

園區(qū)的發(fā)展更新?lián)Q代，集合如：云計(jì)算，物聯(lián)網(wǎng)，大數(shù)據(jù)，人工智能，GIS等新興技術(shù)，通過對(duì)園區(qū)內(nèi)外的數(shù)據(jù)和資源進(jìn)行檢測(cè)、分析、集成和響應(yīng)，實(shí)現(xiàn)對(duì)園區(qū)管理信息化、信息傳遞即時(shí)化、基礎(chǔ)設(shè)施智能化、公共服務(wù)便捷化、產(chǎn)業(yè)發(fā)展現(xiàn)代化、社會(huì)治理精細(xì)化等，以提高園區(qū)產(chǎn)業(yè)聚集能力、企業(yè)競(jìng)爭(zhēng)力，并且以園區(qū)可持續(xù)發(fā)展為目標(biāo)的先進(jìn)園區(qū)發(fā)展模式和理念。

今天將介紹圖撲軟件 Hightopo自主研發(fā)的 HT 引擎協(xié)助打造三維可視化的智慧朔州開發(fā)區(qū)，通過未來科幻的建筑風(fēng)格多維度展示開發(fā)區(qū)，以360度全景可視化結(jié)合數(shù)據(jù)場(chǎng)景聯(lián)動(dòng)，建立一個(gè)控制智慧綜合型的智慧城市項(xiàng)目。

效果展示

整體場(chǎng)景由地球視角動(dòng)態(tài)下鉆至中國(guó)版圖，對(duì)山西省輪廓進(jìn)行特效光邊沿立體描繪，并在此下鉆至朔州開發(fā)區(qū)整體三維場(chǎng)景。其中重點(diǎn)對(duì)科創(chuàng)商務(wù)園區(qū)進(jìn)行漫游動(dòng)畫查看朔州新產(chǎn)品展銷館。

智慧朔州開發(fā)區(qū)以展會(huì)大屏的整體設(shè)計(jì)形式，頁面中展示全區(qū)的三維場(chǎng)景，左右兩側(cè)輔以數(shù)字化智慧城市監(jiān)測(cè)常見的技術(shù)觀念里尼指標(biāo)進(jìn)行展示，提升業(yè)務(wù)人員數(shù)據(jù)分析可視化效率，提升管理決策成功率，輔助領(lǐng)導(dǎo)層進(jìn)行管理預(yù)測(cè)。

系統(tǒng)分析

全場(chǎng)景漫游

除了初始化的園區(qū)全場(chǎng)景漫游、定點(diǎn)漫游外，也提供了單個(gè)園區(qū)的漫游線路，讓用戶以第一人稱的視角按照指定線路對(duì)開發(fā)區(qū)進(jìn)行全場(chǎng)景漫游，在制定線路的時(shí)候可以參考重點(diǎn)區(qū)域或智能化水平較高的區(qū)域進(jìn)行制定，給用戶呈現(xiàn)開發(fā)區(qū)重點(diǎn)發(fā)展區(qū)域以及智能化發(fā)展成效。

園區(qū)信息可視化

園區(qū)信息可視化主要包含園區(qū)GDP、財(cái)政數(shù)據(jù)、工業(yè)總產(chǎn)值、固定資產(chǎn)、產(chǎn)出強(qiáng)度、企業(yè)匯總、投資要素成本、招商引資。通過園區(qū)基本數(shù)據(jù)信息可對(duì)整體園區(qū)基本現(xiàn)狀有直觀的了解。數(shù)據(jù)的展示信息可根據(jù)項(xiàng)目的實(shí)際需求進(jìn)行調(diào)整，以滿足園區(qū)信息的數(shù)據(jù)可視化。

沙盤布局可視化

整合了朔州開發(fā)區(qū)內(nèi)的各項(xiàng)重要信息如園區(qū)道路信息、園區(qū)水系分布、西山生態(tài)林景觀分布等進(jìn)行全方位展示。傳統(tǒng)的園區(qū)管理在成本和投入上都耗費(fèi)很多精力。通過互聯(lián)網(wǎng)多樣化的可視化系統(tǒng)管理方案，整理出一套園區(qū)模塊統(tǒng)一在線可視化管理集合，智慧園區(qū)通過智能化的監(jiān)測(cè)控制與管理系統(tǒng)，促進(jìn)信息應(yīng)用的智慧化和深度化，有效節(jié)省了園區(qū)運(yùn)行所需的能源和人工成本的消耗，提升土地監(jiān)測(cè)、布局監(jiān)控的效率和準(zhǔn)確度，解決最根本的環(huán)節(jié)，提高工作效率、增強(qiáng)園區(qū)服務(wù)質(zhì)量和建筑環(huán)境的利用率，保障園區(qū)安全、穩(wěn)定、持久的發(fā)展。

管網(wǎng)分布可視化

可通過多級(jí)檢索功能菜單實(shí)現(xiàn)給水管道、污水管道、雨水管道、再生水管道、電力管道、通信管道、燃?xì)夤艿馈⒐峁艿赖日故尽９芫W(wǎng)分布可視化可幫助管理者實(shí)現(xiàn)對(duì)綜合管線以標(biāo)準(zhǔn)化的方式進(jìn)行管理，以三維可視化的形式展現(xiàn)地下管線的埋深、形狀、走向、周邊環(huán)境。

同平面管網(wǎng)相比，管道 3D 可視化更方便運(yùn)維人員進(jìn)行地下管道對(duì)應(yīng)查找。也為后期地下管線資源的統(tǒng)籌利用和科學(xué)布局提供參考依據(jù)標(biāo)準(zhǔn)。為管線占用審批等工作提供了準(zhǔn)確、直觀、高效的參考。與此同時(shí)，對(duì)于新增的管網(wǎng)管理，圖撲提供了結(jié)合管網(wǎng)拐點(diǎn)立體坐標(biāo)信息實(shí)現(xiàn)三維管網(wǎng)自動(dòng)渲染生成的功能，為后續(xù)的生產(chǎn)和延續(xù)性使用帶來極大便利。

土地布局可視化

隨著大數(shù)據(jù)、BIM、GIS 等新的技術(shù)理念興起，土地規(guī)劃也有了更新?lián)Q代，而三維形式的可視化展現(xiàn)更能讓土地規(guī)劃可知可控，便于運(yùn)維人員對(duì)的土地進(jìn)行集中化、科學(xué)化管理統(tǒng)籌。打破土地占用數(shù)據(jù)分散的局面，提高園區(qū)土地使用率，高效管理 。圖撲軟件提供基于 WebGL 渲染的三維特效，也讓平臺(tái)中的土地分布數(shù)據(jù)表達(dá)更酷炫多彩容易區(qū)分。

交通布局可視化

通過不同顏色的高亮展示了交通快速路、主干路、次干路。線路可視化可以知道開發(fā)區(qū)的交通線路布局，方便運(yùn)維人員及時(shí)有效的對(duì)交通路線進(jìn)行調(diào)整部署、獲取交通軌跡數(shù)據(jù)信息。輔助園區(qū)管理部門綜合掌控全區(qū)大范圍的線路運(yùn)行管控。在交通布局上，圖撲可視化也可延伸融合更多功能如綜合態(tài)勢(shì)監(jiān)測(cè)：集成地理信息系統(tǒng)、視頻監(jiān)控系統(tǒng)、交管部門各業(yè)務(wù)系統(tǒng)數(shù)據(jù)，對(duì)交通路況車流量、事故處理報(bào)告等要素進(jìn)行綜合監(jiān)測(cè)，幫助管理者實(shí)時(shí)掌握交通整體運(yùn)行態(tài)勢(shì)等等。

園區(qū)可視化實(shí)現(xiàn)價(jià)值

一、 園區(qū)全景視角精細(xì)化展現(xiàn)

園區(qū)內(nèi)建筑物，管網(wǎng)設(shè)施，機(jī)動(dòng)目標(biāo)等基本建筑信息可在系統(tǒng)上全方位進(jìn)行展示。例如園區(qū)內(nèi)各種電力設(shè)施，交通樞紐，地標(biāo)建筑，園區(qū)內(nèi)地下管線，機(jī)動(dòng)目標(biāo)等位置數(shù)據(jù)實(shí)時(shí)展現(xiàn)。

二、園區(qū)信息數(shù)字化展現(xiàn)

原先的園區(qū)就像一個(gè)信息孤島，各部門、各條管理線之間，在信息資源上無法做到交流共享和互通，獨(dú)自運(yùn)營(yíng)各自的信息管理系統(tǒng)，通過圖撲軟件的可視化，在充分利用、整合和挖掘信息技術(shù)和信息資源的基礎(chǔ)上，對(duì)園區(qū)達(dá)到精細(xì)化管理，那么圖撲可視化系統(tǒng)就是園區(qū)智慧成果和價(jià)值的集中體現(xiàn)，讓智慧園區(qū)變得可知可感。

三、園區(qū)管理集中化展現(xiàn)

圖撲可視化園區(qū)管理系統(tǒng)支持融合多部門、不同平臺(tái)的數(shù)據(jù)對(duì)接顯示，管理者可以全方位掌控園區(qū)綜合態(tài)勢(shì)，不同運(yùn)營(yíng)管理者也可以互聯(lián)互通相關(guān)聯(lián)信息。包括支持了：政務(wù)、警務(wù)、交通、電力等實(shí)時(shí)數(shù)據(jù)信息；包括支持集成地理信息、GPS數(shù)據(jù)、建筑物三維數(shù)據(jù)、統(tǒng)計(jì)數(shù)據(jù)、園區(qū)視頻監(jiān)控采集畫面等多類型數(shù)據(jù)。

圖撲可視化是基于 HTML5 打造的純 Web 頁面，只要有瀏覽器就可以打開訪問，客戶可以根據(jù)當(dāng)下使用場(chǎng)景，監(jiān)控態(tài)勢(shì)，自定義布局想要顯示的內(nèi)容。既可以重點(diǎn)顯示專項(xiàng)事件，也可以全局掌控園區(qū)整體態(tài)勢(shì)。快速實(shí)現(xiàn)現(xiàn)代化的、高性能的、跨平臺(tái)的（桌面 Mouse/移動(dòng) Touch/虛擬現(xiàn)實(shí) VR）圖形展示效果及交互體驗(yàn)，并且還能在手機(jī)端或者 PAD 端對(duì)大屏進(jìn)行頁面顯示和監(jiān)控模式等交互控制。

總結(jié)

對(duì)園區(qū)的建設(shè)管理進(jìn)行全方位升級(jí)打造，整合園區(qū)資源，建立自主創(chuàng)新服務(wù)體系，極大地降低園區(qū)企業(yè)的運(yùn)營(yíng)成本，提高工作效率，加強(qiáng)園區(qū)的創(chuàng)新、服務(wù)和管理能力。通過加入圖撲軟件的Hightopo 的大屏的可視化，能及時(shí)利用、挖掘、傳遞數(shù)據(jù)。使數(shù)據(jù)有效化的及時(shí)呈現(xiàn)和傳遞，通過提取出關(guān)鍵、有效的信息，并以酷炫的視覺效果清晰地展現(xiàn)出來。

當(dāng)然我們也更新了數(shù)百個(gè)2D/3D 可視化案例集，在這里你能發(fā)現(xiàn)許多新奇的實(shí)例：《分享數(shù)百個(gè) HT 工業(yè)互聯(lián)網(wǎng) 2D 3D 可視化應(yīng)用案例 》，有興趣的可以至圖撲軟件官網(wǎng)查看更多行業(yè)可視化案例與申請(qǐng)?jiān)囉脋

要：基于WebGL和視頻圖傳技術(shù)，利用傾斜攝影實(shí)景三維數(shù)據(jù)，分析構(gòu)建視頻監(jiān)控圖像與仿真現(xiàn)實(shí)地理空間高度融合場(chǎng)景的技術(shù)方法。完整闡述場(chǎng)景構(gòu)建、信號(hào)接入、投影融合、圖像拼接的技術(shù)路線，詳述融合的數(shù)學(xué)模型和編程實(shí)現(xiàn)，并結(jié)合多年市場(chǎng)調(diào)研經(jīng)驗(yàn)，介紹本項(xiàng)研究的市場(chǎng)應(yīng)用前景。

關(guān)鍵詞： WebGL 傾斜攝影 實(shí)景三維數(shù)據(jù) 投影融合 測(cè)繪學(xué) 視頻圖傳

在地理信息系統(tǒng)(GIS)領(lǐng)域中，基于傾斜攝影測(cè)量技術(shù)制作的實(shí)景三維場(chǎng)景具有多項(xiàng)優(yōu)勢(shì)[1]，不僅能完整地還原地形地貌，尤其是城市環(huán)境中的建筑物外立面、近地面廣告牌等環(huán)境細(xì)節(jié)，而且具有高精度的可量測(cè)性[2]，可進(jìn)行全角度的三維測(cè)量。但是，實(shí)景三維場(chǎng)景是某一時(shí)間節(jié)點(diǎn)的測(cè)量成果，本質(zhì)上屬于靜態(tài)地圖[3]，數(shù)據(jù)的現(xiàn)勢(shì)性問題無法避免。為解決這個(gè)問題，實(shí)景三維GIS越來越多地接入物聯(lián)網(wǎng)傳感器，融合現(xiàn)實(shí)世界的動(dòng)態(tài)情況，來滿足各自的業(yè)務(wù)需求[4]。如接入定位信號(hào)，在實(shí)景三維場(chǎng)景中顯示人員和車輛實(shí)時(shí)位置等。其中一項(xiàng)最重要的物聯(lián)網(wǎng)傳感器就是視頻監(jiān)控設(shè)備，負(fù)責(zé)將現(xiàn)實(shí)世界的實(shí)時(shí)圖像信息接入由實(shí)景三維數(shù)據(jù)構(gòu)建的虛擬現(xiàn)實(shí)場(chǎng)景，并得到廣泛應(yīng)用。然而單一視頻監(jiān)控圖像的視域范圍有限，多路視頻切換或分屏播放都會(huì)導(dǎo)致監(jiān)控目標(biāo)失去焦點(diǎn)，影響監(jiān)控效果[5]。同時(shí)，屏幕化的視頻監(jiān)控圖像孤立于周邊環(huán)境，不能通過屏幕畫面直觀地了解視頻監(jiān)控圖像在現(xiàn)實(shí)世界中的確切位置，及其與周邊環(huán)境的關(guān)系。因此，將視頻監(jiān)控圖像以幾何投影方式貼合到地面(簡(jiǎn)稱視頻貼地)，融合到實(shí)景三維場(chǎng)景中，多路視頻畫面在空間上拼接，形成較大區(qū)域的連續(xù)畫面，確立完整的視頻監(jiān)控環(huán)境成為GIS應(yīng)用研究中一項(xiàng)十分必要的工作。

實(shí)現(xiàn)實(shí)景三維場(chǎng)景與視頻監(jiān)控圖像融合的思路主要包括桌面端和瀏覽器端兩個(gè)方面，本文將主要論述瀏覽器端的研究。

1、基于WebGL構(gòu)建的實(shí)景三維場(chǎng)景

WebGL(WebGraphicsLibrary)是一種三維繪圖協(xié)議，把JavaScript和OpenGLES2.0結(jié)合在一起，為HTML5Canvas提供硬件三維加速渲染[6]。這樣就可以在網(wǎng)頁瀏覽器直接渲染實(shí)景三維場(chǎng)景，而不需要外置插件。目前，常用的WebGL二次開發(fā)接口有CesiumJS和three.js，它們都有完善的地理坐標(biāo)系接口，可以用于開發(fā)標(biāo)準(zhǔn)的GIS應(yīng)用項(xiàng)目。本文以CesiumJS接口庫(kù)為例，構(gòu)建實(shí)景三維場(chǎng)景，因?yàn)镃esiumJS定義了適宜于網(wǎng)絡(luò)傳輸?shù)膶?shí)景三維數(shù)據(jù)格式:3DTiles，這種數(shù)據(jù)是以樹形結(jié)構(gòu)組織起來的瓦片(tiles)集合，并且可以由實(shí)景三維建模軟件ContextCapture直接生產(chǎn)[7]。

CesiumJS建立實(shí)景三維場(chǎng)景的方法十分簡(jiǎn)潔:首先，創(chuàng)建場(chǎng)景對(duì)象(Viewer);然后，創(chuàng)建實(shí)景三維數(shù)據(jù)對(duì)象(Cesium3DTileset);最后，向場(chǎng)景對(duì)象中添加(viewer.scene.primitives.add)對(duì)象即可，如圖1所示。

圖1CesiumJS建立實(shí)景三維的方法

但需要注意的是實(shí)景三維數(shù)據(jù)的高度，與CesiumJS默認(rèn)的“地球”之間會(huì)存在空隙，因此，還要利用CesiumTerrainProvider對(duì)象引入地形數(shù)據(jù)，最終形成完整的環(huán)境效果。

2、視頻監(jiān)控圖像信號(hào)接入

視頻監(jiān)控圖像接入場(chǎng)景首先要獲取到它的數(shù)據(jù)流，不同廠商和型號(hào)的數(shù)據(jù)流使用的編碼標(biāo)準(zhǔn)不盡相同，為了具備更好的兼容性，需要使用通用的網(wǎng)絡(luò)流媒體協(xié)議RTSP(Real-TimeStreamProtocol)進(jìn)行應(yīng)用層的數(shù)據(jù)解析[8]。各廠商設(shè)備的RTSP協(xié)議取流方法有所區(qū)別，但是基本格式相似，都主要包括了IP地址、端口和通道3個(gè)參數(shù)，以海康設(shè)備為例，格式如下:

rtsp://username:password@<address>:<port>/Streaming/Channels/<id>。

但是，目前的HTML5的video標(biāo)簽仍然無法直接播放RTSP直播數(shù)據(jù)流，研究中使用了開源視頻播放器VLC提供的流媒體轉(zhuǎn)碼功能將RTSP轉(zhuǎn)碼為可以直接播放的OGG格式流數(shù)據(jù)。VLC的轉(zhuǎn)碼命令為#transcode，在命令處理工具中執(zhí)行即可[9]。多路視頻同時(shí)轉(zhuǎn)碼只需要?jiǎng)?chuàng)建VLC命令的JavaScript腳本，利用Node.js執(zhí)行即可。但是，此時(shí)的OGG格式流數(shù)據(jù)存在跨域訪問問題，需要在Nginx中代理，并添加頭配置。經(jīng)過代理的OGG格式流數(shù)據(jù)可以直接被HTML5播放，配置參數(shù)如下:add＿h(yuǎn)eaderAccess-Control-Allow-Origin*。

CesiumJS在實(shí)景三維場(chǎng)景中接入視頻資源的方法是將video標(biāo)簽作為材質(zhì)對(duì)象(Material)賦予渲染基元(Primitive)，然后在場(chǎng)景中創(chuàng)建出來即可最終實(shí)現(xiàn)接入。總結(jié)下來，接入流程如圖2所示。

3、視頻監(jiān)控圖像投影融合

實(shí)景三維場(chǎng)景完美地還原了現(xiàn)實(shí)世界的空間關(guān)系，相機(jī)拍攝的畫面本質(zhì)上是鏡頭曝光平面沿著視錐體在地面上的投影[10]。而視頻監(jiān)控圖像與實(shí)景三維場(chǎng)景融合的關(guān)鍵問題就是將監(jiān)控圖像與場(chǎng)景中的同名點(diǎn)配準(zhǔn)，實(shí)現(xiàn)同名點(diǎn)的重合，也就是將畫面逐個(gè)像素的坐標(biāo)從本地坐標(biāo)系轉(zhuǎn)變到視錐體裁剪坐標(biāo)系[11]中。依據(jù)這個(gè)思路，在實(shí)景三維場(chǎng)景中，同樣還原相機(jī)的空間位置和安裝姿態(tài)，并且模擬鏡頭的視錐體，如圖3所示，在視平面還原視頻監(jiān)控圖像，利用視錐體獲得其在實(shí)景三維數(shù)據(jù)表面的投影范圍，即可實(shí)現(xiàn)圖像投影融合。

圖2CesiumJS接入視頻流程

圖3鏡頭模擬的視椎體

還原相機(jī)所需的主要參數(shù)包括表1中幾項(xiàng)，這些參數(shù)可以通過測(cè)量和查看設(shè)備說明書獲得。

表1相機(jī)主要參數(shù)

視頻貼地的渲染基元采用分類基元類(ClassificationPrimitive)，其一致性映射(＿uniformMap)參數(shù)控制webgl渲染的深度計(jì)算和坐標(biāo)轉(zhuǎn)換等映射方式，包括立方體模型視圖(u＿boxMV)和逆立方體模型視圖(u＿inverseBoxMV)兩個(gè)變量，這兩個(gè)變量用于執(zhí)行透視除法，確定視頻裁剪后在實(shí)景三維數(shù)據(jù)表面貼地范圍。其計(jì)算方法參照WebGL投影變換的基本原理[12]，示意圖如圖4所示。

圖4WebGL投影變換基本原理

首先將相機(jī)視錐體原點(diǎn)定位到地理坐標(biāo)，再利用四維矩陣的計(jì)算辦法將地理坐標(biāo)、朝向、俯角、旋轉(zhuǎn)角4個(gè)參數(shù)共同計(jì)算組成相機(jī)類(Camera)的視圖矩陣(viewMatrix)和逆視圖矩陣(inverseViewMatrix)。然后，使用透視錐體類(PerspectiveFrustum)創(chuàng)建視錐體，包括視場(chǎng)角、寬高比、焦距、拍攝距離4個(gè)參數(shù)。透視錐體類的投影矩陣參數(shù)(projectionMatrix)可以獲取該視錐體的透視投影矩陣，經(jīng)過反轉(zhuǎn)(Matrix4.inverse)并與逆視圖矩陣相乘(Matrix4.multiply)得到逆視圖投影矩陣，結(jié)果再反轉(zhuǎn)即可得到視圖投影矩陣。此時(shí)得到的視圖投影矩陣可以用于完成坐標(biāo)變換，利用拍攝距離和四維矩陣的創(chuàng)建辦法(Matrix4.fromUniformScale)生成遠(yuǎn)平面標(biāo)準(zhǔn)模型矩陣，如下所示:

[拍攝距離，0.0,0.0,0.0]

[0.0，拍攝距離，0.0,0.0]

[0.0,0.0，拍攝距離，0.0]

[0.0,0.0,0.0,1.0]

再與逆視圖矩陣相乘得到變換所需模型矩陣，并賦予視頻貼地渲染基元的模型矩陣參數(shù)(modelMatrix)，完成視頻監(jiān)控畫面變換到世界坐標(biāo)系。最后將模擬的視頻監(jiān)控設(shè)備的視圖矩陣與逆視圖投影矩陣相乘，得到立方體模型視圖，同理得到逆立方體模型視圖。將這兩個(gè)模型視圖賦予分類基元類的一致性映射參數(shù)便可以最終實(shí)現(xiàn)視頻監(jiān)控圖像與實(shí)景三維場(chǎng)景的融合，融合效果如圖5所示。

融合效果可以通過以下3點(diǎn)判斷:第一，路口斑馬線在投影后的角度符合實(shí)際的平行關(guān)系，并且位置與實(shí)際位置完全重合;第二，建筑立面牌匾寬度和文字完全重合;第三，人行道邊緣完全銜接。

視頻貼地的基元可以動(dòng)態(tài)渲染，只需要在基元的更新方法(update)中，傳入相機(jī)參數(shù)，判斷視錐體是否發(fā)生變化并相應(yīng)重新計(jì)算模型視圖即可，更新方法(update)會(huì)在每一幀調(diào)用。如將朝向參數(shù)從155.4調(diào)整為152，視頻向逆時(shí)針旋轉(zhuǎn)，牌匾錯(cuò)開的效果如圖6所示。

綜上所述，視頻監(jiān)控圖像投影融合技術(shù)路線總結(jié)如圖7所示。

圖5視頻監(jiān)控與實(shí)景三維場(chǎng)景的融合效果

圖6視頻貼地的基元?jiǎng)討B(tài)渲染效果

圖7視頻監(jiān)控圖像投影融合技術(shù)路線

4、視頻監(jiān)控圖像拼接

多路視頻監(jiān)控圖像的拼接就是將多路視頻同時(shí)融合到實(shí)景三維場(chǎng)景中，依據(jù)擇優(yōu)原則，裁切掉重疊部分，形成連續(xù)的監(jiān)控圖像。CesiumJS的材質(zhì)類(Material)提供了透明通道參數(shù)(alphaImage)，該參數(shù)接收灰度(黑-灰-白)圖片，然后與視頻監(jiān)控圖像進(jìn)行掩碼計(jì)算[13]，便可實(shí)現(xiàn)視頻監(jiān)控圖像的裁切。本地的灰度圖片在創(chuàng)建和編輯的操作方面都不利于Web平臺(tái)的維護(hù)，因此，需要在瀏覽器的畫布標(biāo)簽(canvas)中動(dòng)態(tài)繪制灰度圖。canvas標(biāo)簽提供了完整的繪制方法，lineTo()方法繪制閉合的可見范圍，fill()方法填充顏色，然后將畫布轉(zhuǎn)為base64編碼格式的圖片，與相機(jī)參數(shù)共同存儲(chǔ)即可，如圖8、圖9所示。

圖8視頻圖像裁切的灰度圖

圖9多路視頻融合效果

圖10為圍繞十字路口的五路視頻監(jiān)控圖像拼接成一幅連續(xù)畫面的效果，箭頭所指為監(jiān)控圖像邊界，圈中可以看到一輛公交車從北向南行駛，連續(xù)穿越多個(gè)分視頻畫面。實(shí)驗(yàn)中視頻監(jiān)控設(shè)備的安裝參數(shù)存在誤差導(dǎo)致畫面中物體穿越存在偏移，也證明相機(jī)參數(shù)對(duì)貼地的效果存在關(guān)鍵性的影響。

圖10圖像拼接連續(xù)畫面的效果

5、結(jié)束語

視頻監(jiān)控目前已經(jīng)成為國(guó)家公共安全、國(guó)防、防災(zāi)應(yīng)急、消防、旅游工作中應(yīng)用最為普遍的技術(shù)手段。天網(wǎng)工程、雪亮工程、綜合防治工程、磐石行動(dòng)、數(shù)字城管工程等重要工程都圍繞或重點(diǎn)采用這種技術(shù)建設(shè)。

在多年的用戶體驗(yàn)積累[9]中可以總結(jié)出，用戶需求在視頻監(jiān)控的空間屬性方面做出進(jìn)一步的應(yīng)用效果提升。尤其是在無人機(jī)視頻圖傳的應(yīng)用不斷深入的背景下，視頻與實(shí)景三維數(shù)據(jù)動(dòng)態(tài)融合的應(yīng)用前景將更加寬廣。

各部門具體應(yīng)用可大致總結(jié)如下:在公安行業(yè)，可應(yīng)用于人員和車輛的連續(xù)跟蹤，重點(diǎn)區(qū)域合屏監(jiān)控等;在城管行業(yè)，可應(yīng)用于早、夜市整條街的同時(shí)監(jiān)控;利用無人機(jī)進(jìn)行火災(zāi)、洪水、地震等自然災(zāi)害的實(shí)時(shí)監(jiān)控和救援搜索;重要機(jī)關(guān)單位、廠礦、商場(chǎng)、監(jiān)獄的室內(nèi)外安保連續(xù)監(jiān)控;在旅游行業(yè)，利用固定視頻監(jiān)控和無人機(jī)視頻圖傳應(yīng)用于景區(qū)巡查與搜救、景區(qū)宣傳等。