楊 兵，王方雄*，康祥瑞

?

基于Cesium平臺的GIS園區(qū)系統(tǒng)開發(fā)

楊 兵1,2，王方雄1,2*，康祥瑞3

（1. 遼寧師范大學 遼寧省自然地理與空間信息科學重點實驗室，遼寧 大連 116029；2. 遼寧師范大學 城市與環(huán)境學院，遼寧 大連 116029；3. 北京超圖軟件股份有限公司，遼寧 沈陽 110015）

基于Cesium技術(shù)，探索了二三維于一體的GIS園區(qū)系統(tǒng)的設計方案與開發(fā)技術(shù)。系統(tǒng)實現(xiàn)了地圖在線瀏覽、三維測量標繪、園區(qū)信息管理、場景模型展示等。利用mysql數(shù)據(jù)庫解決了三維模型在線添加不能存儲的問題。為GIS園區(qū)開發(fā)提供了一套完整的設計思路及開發(fā)方案。

Cesium；GIS園區(qū)；WebGIS

0 引言

至數(shù)字地球[1-2]概念被提出以來，WebGIS技術(shù)在定位導航、旅游管理、環(huán)境保護、綜合治理、城鄉(xiāng)建設等諸多領(lǐng)域展現(xiàn)出強大的應用潛力和市場價值[3-9]?，F(xiàn)階段園區(qū)網(wǎng)站開發(fā)常采用三維GIS。對于加載三維場景多采用發(fā)布為地圖服務的方式來實現(xiàn)，但這較難實現(xiàn)模型的動態(tài)添加及存儲[10]。本文采用mysql數(shù)據(jù)庫來存儲模型的坐標及屬性在需要時在由前端調(diào)用渲染的設計思路成功解決了這一 問題。

1 系統(tǒng)設計

1.1 系統(tǒng)結(jié)構(gòu)設計

園區(qū)GIS系統(tǒng)采用B/S三層架構(gòu)[11]。表現(xiàn)層（UI層）采用標準的瀏覽器形式向用戶提供訪問系統(tǒng)的客戶端。該層主要采用HTML5+CSS3編寫，運用超圖iServer和WebGL API實現(xiàn)二維矢量數(shù)據(jù)和三維模型場景相結(jié)合的GIS二三維一體化。服務層包括Web服務器和應用服務器，選用Apache+Tomcat可以很好地承接起數(shù)據(jù)到接口的調(diào)用訪問從而將數(shù)據(jù)層和表現(xiàn)層連接起來。數(shù)據(jù)層主要完成系統(tǒng)中所有數(shù)據(jù)的存儲及訪問，為服務層和表現(xiàn)層提供數(shù)據(jù)支持。為更好地支持當前主流數(shù)據(jù)，系統(tǒng)以BingMap作為底圖、矢量數(shù)據(jù)采用KMZ、三維模型采用gtlf、場景數(shù)據(jù)采用SuperMap iServer發(fā)布的三維傾斜攝影數(shù)據(jù)；同時用MySQL數(shù)據(jù)庫來存儲gtlf模型的屬性信息以滿足增刪改查操作的需求，用本地Json數(shù)據(jù)來存儲一些不需要經(jīng)常改動的文案數(shù)據(jù)以保證系統(tǒng)最快的加載速度。

1.2 系統(tǒng)界面設計

系統(tǒng)界面框架主要由Html5+Css3+JavaScript搭建，并引用jQuery及Bootstrap等插件為用戶提供了自由縮放顏色變化等良好的交互體驗。主界面上邊為模塊選項卡與左側(cè)的功能面板聯(lián)動顯示，中間為地圖主窗口，用來裝載網(wǎng)絡地圖、矢量數(shù)據(jù)、三維切片及模型，主窗口的下方浮動著坐標控件。主界面右側(cè)為信息面板可根據(jù)所選擇的功能改變顯示隱藏狀態(tài)。

1.3 系統(tǒng)功能設計

系統(tǒng)采用模塊化的功能設計。主要包括地圖基礎(chǔ)功能模塊、輔助工具模塊、園區(qū)管理模塊、模型管理模塊、場景漫游模塊如圖1所示?；A(chǔ)功能模塊除一些常見的地圖瀏覽功能外還具有三維地圖特有的視角切換、光照模擬功能。輔助工具模塊主要包括二三維場景的測量標繪。園區(qū)管理模塊主要完成園區(qū)所有矢量數(shù)據(jù)的加載與移除，以及信息推 送顯示。場景模型模塊主要完成三維場景加載及移除、實現(xiàn)場景漫游，以及實體模型的添加、顯示和刪除。

1.4 系統(tǒng)數(shù)據(jù)庫設計

通常WebGIS系統(tǒng)中動態(tài)添加的三維gtlf模型本身不具有任何屬性，也無法在添加后實現(xiàn)保存。為此系統(tǒng)引入MySQL數(shù)據(jù)庫來存儲gtlf模型的屬性信息并在頁面初始化時逐一動態(tài)渲染。該類模型在數(shù)據(jù)庫中的屬性數(shù)據(jù)字典如表1。

圖1 系統(tǒng)功能模塊

表1 模型數(shù)據(jù)屬性字典

Tab.1 Model data attribute dictionary

2 系統(tǒng)功能實現(xiàn)

2.1 基礎(chǔ)功能模塊

基礎(chǔ)功能模塊通過Cesium創(chuàng)建Viewer對象。通過Viewer對象加載動畫控件和時間線控件；通過Viewer的BingMapsImageryProvider加載必應地圖，同時開啟光照模擬；通過Viewer的Scene.addS3-MTilesLayerByScp實例化promise來加載傾斜攝影數(shù)據(jù)。當鼠標在地圖窗口移動時坐標標簽會實時顯示鼠標所在位置的經(jīng)緯度、海拔高度及相機高度信息。右鍵雙擊地圖某點會彈出該位置坐標信息。初始化完成后界面如圖2所示。

2.2 輔助功能模塊

輔助功能模塊通過Cesium的MeasureHandler來實例化對應的測量對象并綁定相應的測量事件。通過Cesium的DrawHander來創(chuàng)建點、線、面、標注對象并分別綁定繪制點、繪制線、繪制面、添加標注事件，然后通過激活對應的事件完成測量或標繪。添加標注完成后會自動調(diào)用保存事件通過ajax將標注的經(jīng)緯度傳至后臺并保存至MySql數(shù)據(jù)庫中。系統(tǒng)中的清除按鈕綁定了清除測量標繪事件，能夠清除對應事件在畫布創(chuàng)建的矢量數(shù)據(jù)但不會清除數(shù)據(jù)庫中保存的點坐標。

圖2 系統(tǒng)初始界面

2.3 園區(qū)管理模塊

園區(qū)管理模塊通過Cesium的KmlDataSource的load方法向Viewer的dataSources加載kmz矢量數(shù)據(jù)并設置相機視角，并在需要時通過remove方法移除對應圖層。加載的數(shù)據(jù)包括園區(qū)邊界、路網(wǎng)數(shù)據(jù)、用地類型等。單擊某圖層中的元素會在右上角彈出該元素屬性信息及視角轉(zhuǎn)換控件，談及空白地區(qū)退出屬性查看。彈窗部分能夠以文本、音頻、視頻等格式展示園區(qū)內(nèi)各設施場所的信息。為了更加快速的獲取數(shù)據(jù)文本信息以json格式存儲在項目的本地文件夾中通過ajax來遍歷訪問。

2.4 場景模型模塊

場景模型模塊通過Viewer的entities在線添加gtlf模型，添加完成后通過ajax調(diào)用后臺方法將所添加模型的經(jīng)緯度、類型、尺寸存儲至數(shù)據(jù)庫。調(diào)用顯示所有模型時，將從數(shù)據(jù)庫取出對應模型的所有記錄，每條記錄都會被組裝加工成一個實體模型渲染在地圖相應位置。開啟場景漫游功能后，能通過“W、S、A、D”按鍵來移動相機視角實現(xiàn)場景漫游。功能界面如圖3所示。

圖3 添加三維模型

3 結(jié)束語

GIS園區(qū)系統(tǒng)采用JavaEE作為開發(fā)平臺。前端采用Html5+Css3+JavaScript開發(fā)，后臺采用java編寫，并引用jQuery、Bootstrap等多種插件優(yōu)化界面UI。通過SuperMap iServer發(fā)布地圖服務，依托Cesium將網(wǎng)絡地圖作為地圖來源實現(xiàn)二維矢量數(shù)據(jù)與三維場景的一體化展示查詢。系統(tǒng)采用網(wǎng)絡數(shù)據(jù)庫+本地文件相結(jié)合形式存儲s3m、gtlf、json、kmz、mp3、MP4、png等多種數(shù)據(jù)格式，即解決了實體模型無法存儲的問題又兼顧了數(shù)據(jù)的加載速度。為GIS園區(qū)開發(fā)提供了一套完整的設計方案及思路。

[1] 李德仁. 數(shù)字地球與“3S”技術(shù)[J]. 中國測繪, 2003(02): 30-33.

[2] 黃亮, 於雪琴. 基于雨課堂的《數(shù)字地球?qū)д摗氛n程教學模式改革研究[J]. 軟件, 2018, 39(08): 224-227.

[3] 張彧. 基于Cesium平臺的導航衛(wèi)星軌道模擬與可視化[D]. 華東師范大學, 2017.

[4] 陳俊, 張雷, 王遠飛. 基于北斗和GPS的森林防火人員調(diào)度指揮系統(tǒng)[J]. 軟件, 2012, 33(02): 27-30.

[5] 張畢祥. 基于傾斜攝影測量技術(shù)在大比例尺地形圖測繪中的研究[J]. 軟件, 2018, 39(7): 146-151

[6] 張欣, 張漢中, 董偉哲, 周小平. 基于WebGIS和虛擬現(xiàn)實的智慧旅游深度結(jié)合研究[J]. 中國新通信, 2018, 20(08): 58-60.

[7] 陳美伊. 基于GIS 的旅游景區(qū)虛擬實現(xiàn)技術(shù)的研究[J]. 軟件, 2015, 36(10): 30-32

[8] 李月華. 基于WebGIS的環(huán)境監(jiān)管云平臺設計與建設[J]. 測繪與空間地理信息, 2017, 40(01): 121-124+127.

[9] 趙桔青, 陶福壽. 基于GIS的城鎮(zhèn)土地資源承載力評價[J]. 軟件, 2018, 39(7): 52-56.

[10] 李海生, 賴龍, 蔡強, 毛典輝, 陳誼. Hadoop環(huán)境下三維模型的存儲及形狀分布特征提取[J]. 計算機研究與發(fā)展, 2014, 51(S2): 18-29.

[11] 黃興榮. 基于B/S架構(gòu)模式的三層結(jié)構(gòu)設計與實現(xiàn)[J]. 電腦知識與技術(shù), 2015, 11(32): 52-53.

Development of GIS Park System Based on Cesium Platform

YANG Bing1,2, WANG Fang-xiong1,2*, KANG Xiang-rui3

(1. Liaoning Key Lab of Physical Geography and Geomatics, Liaoning Normal University, Dalian 116029, China; 2. School of Urban and Environmental Sciences,Liaoning Normal University, Dalian 116029, China; 3. SuperMap Software Co., Ltd. Shenyang 110015, China)

Based on Cesium technology, the technique of development and project of design for GIS Industrial Park System that combines 2D and 3D is groped after. The system manages to realize map online browsing, 3D measure marking, park information management as well as exhibition of site model. It solves the problem of saving online 3D model attachment using MySQL database, offering an integral design thought and development project for GIS Park development.

Cesium; GIS park; WebGIS

TP311.52

A

10.3969/j.issn.1003-6970.2018.12.023

楊兵(1992-)，男，研究生，主要研究方向：WebGIS研究與開發(fā)；康祥瑞(1991-)，男，研究生畢業(yè)，主要研究方向：GIS開發(fā)與遙感應用。

王方雄(1973-)，男，副教授，主要研究方向：GIS建模與集成、網(wǎng)絡GIS。

楊兵，王方雄，康祥瑞. 基于Cesium平臺的GIS園區(qū)系統(tǒng)開發(fā)[J]. 軟件，2018，39（12）：99-102