李佳俊，黃祥志 ，趙亞萌 ，雷國業(yè) ，趙小明

（1.中國科學(xué)院大學(xué)電子電氣與通信工程學(xué)院，北京 101400；2.中國科學(xué)院空天信息創(chuàng)新研究院遙感衛(wèi)星應(yīng)用國家工程實驗室，北京 100020；3.中科空間信息廊坊研究院，河北 廊坊 065001）

近年來，隨著科技水平的不斷提高，遙感作為綜合性的探測技術(shù)，數(shù)據(jù)獲取能力得到有效提升，數(shù)據(jù)規(guī)模已邁向 PB 級［1，2］。針對海量多源異構(gòu)的空間數(shù)據(jù)，如何進行高效組織、管理及可視化已經(jīng)是當(dāng)前研究的熱點問題。與此同時，數(shù)據(jù)以二維方式進行展示時可視性與表達性存在短板，空間數(shù)據(jù)的三維可視化成為必然趨勢［3］。CesiumJS 作為開源且免費的三維地球可視化框架受到了大家的青睞，也在不同行業(yè)、不同領(lǐng)域得到廣泛應(yīng)用，張曉慶等［4］利用無人機傾斜攝影測量技術(shù)獲得的地形數(shù)據(jù)，構(gòu)建了利用CesiumJS 水上水下一體化三維河道場景WebGIS 平臺；Mehmet 等［5］基于 CesiumJS 實現(xiàn)了異構(gòu)的三維城市模型的重構(gòu)與可視化。通過瀏覽器對這些Web-GIS 平臺訪問較方便，但也有會打開多個無關(guān)網(wǎng)頁，其系統(tǒng)本身性能會受影響、容易被爬取數(shù)據(jù)以及受到惡意代碼植入等突出問題，隨著Electron、Node 等技術(shù)不斷完善發(fā)展，使上述問題的解決有了可能。

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

1.1 CesiumJS 多源數(shù)據(jù)可視化技術(shù)

CesiumJS 是基于WebGL 開發(fā)的三維地球引擎API，除了在局部模型渲染精度上稍弱于主流的三維圖形庫Three.js 和BabylonJS 外，其在全球尺度的地理空間可視化下具有明顯優(yōu)勢；與2017 年末發(fā)布的 Google Earth Web 相比，CesiumJS 更多地是作為開發(fā)框架生產(chǎn)不同需求的軟件產(chǎn)品［6-8］，國外的Celestrak 衛(wèi)星仿真平臺，國內(nèi)的天地圖、超圖等平臺的Web 三維地球均借助其開發(fā)。

CesiumJS 主要借助 ImageryProvider、TerrainProvider 和DataSourceCollection 3 個基類派生出的不同子類可視化影像、地形、矢量數(shù)據(jù)，通過Cesium3DTileset 類可視化傾斜攝影測量、點云和建筑模型BIM等三維數(shù)據(jù)，其架構(gòu)如圖1 所示。

圖1 CesiumJS 架構(gòu)

1.2 Electron 跨平臺開發(fā)技術(shù)

Electron 是跨平臺的原生桌面應(yīng)用開發(fā)框架，使用Web 技術(shù)創(chuàng)建的桌面應(yīng)用運行時，其基于Chromium 和Node 技術(shù)，自2016 年發(fā)布首個版本以來已經(jīng)構(gòu)建了較為豐富且成熟的生態(tài)體系。其優(yōu)點是既能渲染 UI 界面、調(diào)用 Web 服務(wù) API，又能實現(xiàn) Web 程序無法做到的訪問文件系統(tǒng)和調(diào)用已編譯模塊（如dll 等）功能［9］；并且能脫離瀏覽器的沙盒機制［10］，防止惡意代碼的注入。Electron 由主進程和零個或多個渲染器進程兩部分組成，主進程對應(yīng)用的生命周期事件進行響應(yīng)，并與原生操作系統(tǒng)的API 進行通信；每個渲染器進程以單線程運行，用于渲染GUI 界面，對于操作系統(tǒng)級別API 的訪問需要與主進程進行通信來實現(xiàn)。

目前主流的跨平臺編輯器Visual Studio Code、代碼托管平臺Github 的客戶端程序和國內(nèi)的網(wǎng)Cesium 實驗室都用到了Electron 框架。

2 應(yīng)用案例

2.1 基于多源數(shù)據(jù)的遙感巡河可視化平臺

2.1.1 系統(tǒng)簡介 遙感巡河可視化平臺借助遙感衛(wèi)星、無人機等高時間、空間分辨率的遙感數(shù)據(jù)資源對某一范圍內(nèi)的河流進行常態(tài)化、立體式監(jiān)測，及時發(fā)現(xiàn)河流水質(zhì)、沿河建筑等存在的異常問題，進而保障周邊農(nóng)、漁等產(chǎn)業(yè)的良性發(fā)展。本平臺采用數(shù)據(jù)層、服務(wù)層、應(yīng)用層3 層架構(gòu)，如圖2 所示，基于CesiumJS和Vue 等主流Web 前端技術(shù)開發(fā)。

圖2 遙感巡河可視化平臺架構(gòu)

2.1.2 核心功能及實現(xiàn)效果 無人機遙感巡河功能是模擬無人機按照規(guī)定路線和指定高度飛行時，機載相機同步拍攝河流及沿岸狀況并顯示相機不同視角畫面的仿真過程，從而達到巡河目的，實現(xiàn)效果如圖3 所示。主要利用實體集合類的add 方法進行無人機模型和巡河軌跡的添加顯示，通過設(shè)置availability 和position 屬性規(guī)定巡河時間跨度和巡河位置，關(guān)鍵代碼如下。

圖3 無人機遙感巡河功能

衛(wèi)星遙感變化監(jiān)測功能是將多時相遙感影像反演得到的信息產(chǎn)品依據(jù)時間順序按需或動態(tài)加載，展現(xiàn)其空間變化過程。如圖4 所示，以太湖水域藍(lán)藻監(jiān)測為例，時間范圍為2020 年3—6 月，屏幕左側(cè)為反演得到的藍(lán)藻覆蓋專題信息產(chǎn)品，右側(cè)為同期太湖水域高分二號遙感影像，滑動中間分割線可以進行卷簾操作，點擊時間軸的時間節(jié)點可以進行圖層的切換，同時通過播放器按鈕可進行多時相數(shù)據(jù)的滾動播放。以太湖遙感影像加載方式為例，通過addWMTSMapLayer 方法加載WMTS 服務(wù)，設(shè)置圖層的splitDirection 屬性，將其顯示在分割線右側(cè)，關(guān)鍵代碼如下。

圖4 太湖藍(lán)藻變化監(jiān)測功能

上述平臺打包后可利用Electron 框架封裝成不同操作系統(tǒng)下的桌面GIS 應(yīng)用，具體操作時通過修改主進程main.js 中主窗口的loadURL 地址，配置electron-packager 命令下的各參數(shù)后再次打包，打包后的程序不會對其原有功能產(chǎn)生影像。

2.2 基于五層十五級數(shù)據(jù)組織的可視化桌面客戶端

2.2.1 系統(tǒng)簡介 五層十五級數(shù)據(jù)組織模型是顧行發(fā)等［11］提出的一種空間數(shù)據(jù)組織模型，主要應(yīng)用在遙感數(shù)據(jù)工程化領(lǐng)域，其將地球球面按照不同層級的經(jīng)緯度間隔進行剖分，其優(yōu)勢是貼合國家基本比例尺，與其他組織模型相比有更小的信息冗余度［12］。目前，該方法已經(jīng)被用來管理MODIS、Landsat 和高分?jǐn)?shù)據(jù)等國內(nèi)外遙感影像數(shù)據(jù)［13］。以遙感影像為例，在實際的業(yè)務(wù)場景中，經(jīng)過規(guī)格化處理后的遙感瓦片的命名格式為“平臺_傳感器_時間_源數(shù)據(jù)_層級_行_列-光譜類型.格式類型”，且通過分發(fā)平臺下載存儲在本地用戶，基于以上2 個要素開發(fā)了本套系統(tǒng)，本系統(tǒng)支持對該命名格式的本地數(shù)據(jù)進行加載，并能于在線與離線2 種模式下進行操作，其基礎(chǔ)功能有圖層管理、地形、量測、鷹眼等，如圖5所示。

圖5 規(guī)格化后的GF-2 遙感影像瓦片可視化

2.2.2 核心功能 “2.1”所述系統(tǒng)加載的空間數(shù)據(jù)來自GIS 服務(wù)器或在線資源，本系統(tǒng)在此基礎(chǔ)上主要支持對本地數(shù)據(jù)資源的讀取與可視化。主要分為以下2 種模式：①讀取指定類型文件，即對文件系統(tǒng)中規(guī)格化處理后的GeoJSON、KML、CZML 等格式的矢量數(shù)據(jù)，PNG、JPEG 等格式的柵格數(shù)據(jù)以及gltf 格式的三維模型數(shù)據(jù)的讀取與可視化；②讀取zip 格式的文件壓縮包，即將上述不同類型的數(shù)據(jù)放置在相同文件夾壓縮后，對壓縮文件進行讀取與可視化。此時涉及Electron 主進程與渲染器進程間的跨進程通信，主要利用了渲染器進程的remote 模塊、主進程的 dialog 模塊以及 Node 的 fs 和 path 模塊，其通信機制如圖6 所示。

圖6 本地文件讀取時的跨進程通信機制

在①中，渲染器進程獲取到本地文件的路徑及文件名后會根據(jù)文件的后綴名實例化CesiumJS 相對應(yīng)的類或接口，根據(jù)文件所在路徑進行讀取并顯示在三維地球上；②在①的基礎(chǔ)上，通過npm 的adm_zip 對壓縮文件進行解壓并對解壓后的文件遍歷讀取。圖7 為規(guī)格化后的耕地信息矢量數(shù)據(jù)，點擊地塊要素可以顯示其面積、所在位置、行列號等信息。

圖7 規(guī)格化后的本地耕地矢量數(shù)據(jù)可視化

3 結(jié)語

本研究通過對基于CesiumJS 和Electron 框架開發(fā)的2 個實際工程項目的介紹，提出在不影響原有系統(tǒng)功能的前提下，利用Electron 技術(shù)能夠快速將WebGIS 應(yīng)用程序打包封裝成桌面GIS 應(yīng)用程序，能夠擺脫瀏覽器的沙盒機制，提升系統(tǒng)的安全性。與此同時，Electron 與操作系統(tǒng)的可交互性擴展了CesiumJS 的應(yīng)用功能和場景，如對用戶本地數(shù)據(jù)可視化的支持。本研究所介紹的案例還集中在空間數(shù)據(jù)本身可視化層面，未來可以綜合應(yīng)用2 種技術(shù)并通過JavaScript 和其他語言的混合編程來實現(xiàn)空間數(shù)據(jù)的處理與分析功能，從而提升空間數(shù)據(jù)的綜合應(yīng)用水平，實現(xiàn)更好的用戶體驗。