基于Cesium的大氣污染三維動態(tài)可視化系統(tǒng)設計

王賀，王志寶，陳良富，趙亮

(1.東北石油大學，計算機與信息技術學院，黑龍江，大慶 163000；2.中國科學院空天信息創(chuàng)新研究院，遙感科學國家重點實驗室，北京 100000)

0 引言

近年來，大氣污染問題日益突出。為了能夠準確地掌握大氣污染的分布情況，古黃玲等[1]將GIS技術與環(huán)境模型相結(jié)合，展示了株洲市污染點源大氣污染物可視化結(jié)果；XIONG等[2]對中國時空分布特征和PM2.5動態(tài)演化趨勢進行可視化展示，以二維形式呈現(xiàn)；PARK等[3]基于Tableau軟件對韓國空氣污染分布進行了展示；董立曄[4]基于Arcgis Engine進行二次開發(fā)，構(gòu)建了PM2.5可視化系統(tǒng)，以靜態(tài)方式呈現(xiàn)。現(xiàn)有研究下的大氣污染可視化表達大都采用二維方式呈現(xiàn)，部分三維可視化是以靜態(tài)方式展示，同時存在僅展示污染數(shù)值，尺度單一，未能連續(xù)、動態(tài)地展示出不同時間下的變化情況等問題。

針對以上問題，本文提出了一種基于Cesium的大氣污染三維動態(tài)可視化展示。采用B/S模式，服務器端負責數(shù)據(jù)的收集、保存以及計算；客戶端采用Cesium.js地圖引擎結(jié)合Echarts可視化庫負責可視化效果呈現(xiàn)，以三維、動態(tài)地可視化方式展示全球尺度和中國尺度的大氣污染嚴重程度。

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

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

所設計的系統(tǒng)架構(gòu)分為數(shù)據(jù)層、服務層、可視化層。研究中用到的空氣質(zhì)量數(shù)據(jù)來源于中國環(huán)境監(jiān)測總站；數(shù)字高程模型(DEM)及影像數(shù)據(jù)來源于美國地質(zhì)勘探局USGS(united states geological survey)。將數(shù)據(jù)存儲到服務器，可以有效緩解客戶端的壓力，所以選擇在服務器端進行數(shù)據(jù)的存儲與計算處理；可視化端負責渲染與呈現(xiàn)。采用B/S模式，用戶在瀏覽器端對服務器提出請求，服務器端通過請求找到相應的數(shù)據(jù)，解析執(zhí)行后，將得到的結(jié)果返回給瀏覽器端，瀏覽器加載頁面內(nèi)容，顯示給用戶。系統(tǒng)總體架構(gòu)如圖1所示。

圖1

1.2 相關介紹

1.2.1 Cesium.js

Cesium是一個開源JavaScript庫，能夠顯示三維地形的地圖。它可以用來展示多源數(shù)據(jù)，包括三維模型數(shù)據(jù)、地形數(shù)據(jù)、矢量數(shù)據(jù)、影像數(shù)據(jù)等。支持gltf、3D tiles geojson、wmts、STK等格式。同時，Cesium還支持動態(tài)三維展示、允許設置光照、大氣等參數(shù)，是當前可視化平臺中的佼佼者。

1.2.2 Vue.js

Vue.js是一套漸進式JavaScript框架，以自底向上的方式構(gòu)建用戶界面。Vue.js的前端架構(gòu)模式采用MVVM且具有簡單、靈活的API。由于Vue只關注視圖層的特點，不僅容易學習、上手，與第三方庫或既有項目整合也更加方便。

1.2.3 Echarts

Echarts是百度公司推出的一個開源可視化庫，能夠提供全面、直觀、高度定制的數(shù)據(jù)可視化圖表。Echarts支持時間軸組件timeline,通過時間軸的控制可以實現(xiàn)數(shù)據(jù)的動態(tài)變化，同時支持呈現(xiàn)千萬級的數(shù)據(jù)量。

2 關鍵技術

2.1 關鍵技術介紹

2.1.1 三維柱狀圖

柱狀圖可以直觀地展示多分類的數(shù)據(jù)變化以及同類別各變量的對比情況，更多的用于對比分析，由于三維表達在直觀性和美觀性等方面的優(yōu)勢,越來越多地應用于可視表達中。何海斌[5]采用三維柱狀圖的方式對交通中隱患區(qū)域的應急力量進行對比，取得了很好的效果。王全民等[6]基于三維柱狀圖對Netflow日志的流量時序圖進行展示。在三維柱狀圖的構(gòu)建過程中，對于高度的確定至關重要，需要選擇合適的拉伸比例，更好地表達數(shù)據(jù)的空間分布。本次研究中全球尺度三維可視化采用將三維柱狀圖與三維地球進行結(jié)合的方式，并實現(xiàn)動態(tài)效果更好地展示全球各個國家的大氣污染情況。

2.1.2 熱力圖

熱力圖是一種用于展示某種現(xiàn)象聚集程度常用的方法。通過顏色變化程度，可以直觀地展示出熱點分布等信息。周小玲等[7]以熱力圖的方式對人群活動時間分布特征進行了研究。呂偉等[8]通過繪制應急避難疏散路徑熱力圖，直觀地展示了應急避難的關鍵路線，提高了整體應急避難效率。在對大氣污染進行研究時，采用熱力圖可以表示出污染氣體在某一區(qū)域的聚集情況。本次研究中全國尺度三維動態(tài)可視化采用熱力圖的方式展現(xiàn)全國各地區(qū)空氣質(zhì)量情況，并結(jié)合Echarts展示各個省份的具體數(shù)值及變化趨勢。

2.2 關鍵技術實現(xiàn)

2.2.1 三維柱狀圖實現(xiàn)

三維柱狀圖的繪制包含兩部分：底面部分和高度部分。首先獲取以json格式存儲的世界各國的經(jīng)緯度坐標，并根據(jù)國家名稱獲取到各國污染數(shù)值，根據(jù)污染數(shù)值的不同繪制出大小不同的底部，底部范圍越大，證明該國污染越嚴重；然后根據(jù)獲取到的數(shù)值繪制高度部分，污染數(shù)值越大，繪制的高度也越高。顏色映射依據(jù)2012 年由環(huán)境保護部發(fā)布的《環(huán)境空氣質(zhì)量指數(shù)(AQI)技術規(guī)定(試行)》(HJ 633-2012)，空氣質(zhì)量指數(shù)共分為6個級別。根據(jù)指數(shù)大小，空氣質(zhì)量指數(shù)在0到50之間為優(yōu)，在51到100為良，在101到150為輕度污染，在151到200之間為中度污染，在201到300為重度污染，在300以上為嚴重污染。三維柱狀圖的顏色根據(jù)1～6級逐級變化，分別對應綠色、黃色、橙色、紅色、紫色、褐紅色。

2.2.2 熱力圖實現(xiàn)

首先獲取到計算后的濃度分布數(shù)據(jù)，每個點的數(shù)據(jù)格式為{x:xxx,y:xxx,value:xxx}，其中，xxx處填寫當前點的經(jīng)度值，yyy處填寫當前點的緯度值，value處填寫當前點的污染濃度值；利用canvas中繪制圓形的arc方法將每一個數(shù)據(jù)映射為一個圓形，具體方法為arc(x,y,radius,startAngle,endAngle,anticlockwise)。方法中的x值和y值分別為獲取到的經(jīng)緯度坐標值，startAngle表示為起始角度，取值為0，endAngle表示為終止角度，取值為2*Math.PI。為了避免所有生成的圓形相同，設置一個全局的透明度globalAlpha，透明度的值隨著value值的增大而增大，并實現(xiàn)漸變色效果，使得圓形區(qū)域內(nèi)從圓心到邊緣處的值逐漸變小；最后將各個圓形內(nèi)的強度值進行疊加，并根據(jù)上述空氣質(zhì)量的6個級別進行顏色映射，完成熱力圖的繪制。

3 三維動態(tài)可視化實現(xiàn)

3.1 全球尺度三維可視化實現(xiàn)

本次研究中全球尺度三維可視化以三維柱狀圖的形式展示每個國家的具體AQI數(shù)值，實現(xiàn)的具體功能包括：以三維柱狀圖的形式展示不同國家空氣質(zhì)量情況；空氣質(zhì)量不同，繪制的高度不同、顏色不同；鼠標移動到某一國家處顯示數(shù)值；實現(xiàn)三維地球自轉(zhuǎn)，動態(tài)展示空氣質(zhì)量情況；選擇全國尺度時，自動銷毀三維柱狀圖。圖2為實現(xiàn)的全球尺度三維可視化效果。圖3為三維可視化濃度值與顏色值對應柱狀圖。

圖2 全球尺度三維可視化

圖3 濃度值與顏色值對應柱狀圖

3.2 全國尺度三維可視化實現(xiàn)

本次研究中全國尺度三維可視化以熱力圖的形式展示每個省份的空氣質(zhì)量情況，并以北京市為例以統(tǒng)計圖的方式展示2019年第四季度的AQI變化情況。實現(xiàn)的具體功能包括：以熱力圖的形式展示全國空氣質(zhì)量情況；用柱狀圖顯示各省份具體數(shù)值；用折線圖顯示北京市第四季度AQI指數(shù)；熱力圖與折線圖聯(lián)動，實現(xiàn)動態(tài)可視化效果；選擇全球尺度時，自動銷毀熱力圖。圖4為實現(xiàn)的全國尺度三維可視化效果。

圖4 全國尺度三維可視化

3.3 可視化結(jié)果分析

從全球尺度三維可視化結(jié)果中可以看出，以三維柱狀圖的方式觀測效果較好，從顏色及高度信息中可以快速了解到全球各個國家的空氣質(zhì)量情況，選中具體國家可以看出具體數(shù)值。目前全球范圍內(nèi)北美及歐洲地區(qū)空氣質(zhì)量較好，非洲及亞洲地區(qū)普遍空氣質(zhì)量較差；從全國尺度三維可視化結(jié)果可以看出全國空氣質(zhì)量整體效果，通過柱狀圖及折線圖可以看到具體數(shù)值以及變化趨勢，取得了很好的效果。

4 總結(jié)

本文針對傳統(tǒng)大氣污染可視化的問題，提出了基于Cesium的大氣污染三維動態(tài)可視化。可視化系統(tǒng)采用B/S模式，從全球尺度和全國尺度下以三維柱狀圖以及熱力圖的形式實現(xiàn)了大氣污染三維動態(tài)可視化，并結(jié)合Echarts展示了各省份空氣質(zhì)量具體數(shù)值及北京市2019年第四季度變化趨勢。為用戶提供了良好的交互體驗，該研究具有一定的應用價值。