天津市地震應(yīng)急數(shù)據(jù)可視化系統(tǒng)設(shè)計與實現(xiàn)

趙士達

前言

我國地震活動分布廣、頻率高、震源淺、強度大，對社會經(jīng)濟發(fā)展和人們的正常生活產(chǎn)生了巨大影響。震后的快速響應(yīng)是減輕地震災(zāi)害損失的一種有效途徑，其中地震應(yīng)急基礎(chǔ)數(shù)據(jù)是地震應(yīng)急工作的基礎(chǔ)，是各級政府采取應(yīng)急救援行動是否及時、合理、準(zhǔn)確的基本依據(jù)。如何快速、高效地利用應(yīng)急基礎(chǔ)數(shù)據(jù)是當(dāng)前應(yīng)急管理部門和行業(yè)專家的主要研究方向之一，如符號化與真實感協(xié)同的地震災(zāi)情信息可視化方法[1]、支持大規(guī)模地震探測數(shù)據(jù)快速可視化的云端數(shù)據(jù)緩存技術(shù)[2]、基于移動通信大數(shù)據(jù)的地震災(zāi)區(qū)人口快速處理系統(tǒng)研究[3]、耦合動態(tài)觀測數(shù)據(jù)的城市災(zāi)害風(fēng)險評估過程建模與可視化[4]。地震應(yīng)急基礎(chǔ)數(shù)據(jù)主要以空間數(shù)據(jù)為主，如何有效地將多種空間數(shù)據(jù)進行聚合和渲染是空間數(shù)據(jù)可視化的一個重點工作。

天津市地震應(yīng)急數(shù)據(jù)可視化系統(tǒng)分別對天津人口、經(jīng)濟、交通、地震觀測臺站、避難場所、地震應(yīng)急核心網(wǎng)絡(luò)等數(shù)據(jù)進行了可視化的展示。此外，該系統(tǒng)還具有數(shù)據(jù)發(fā)布、分享和交互等功能。

1 地震應(yīng)急可視化系統(tǒng)的整體設(shè)計

天津市地震局現(xiàn)有的地震應(yīng)急基礎(chǔ)數(shù)據(jù)存儲在oracle數(shù)據(jù)庫中，主要用于地震災(zāi)害損失快速評估和地震專題圖的繪制[5]。但現(xiàn)有的數(shù)據(jù)格式和存儲方式不利于數(shù)據(jù)的可視化展示，所以本文所介紹的系統(tǒng)對原有的數(shù)據(jù)格式和存儲方式進行了加工處理，將數(shù)據(jù)加工成JSON或JavaScript格式，便于數(shù)據(jù)的展示和分發(fā)。天津市地震應(yīng)急數(shù)據(jù)可視化系統(tǒng)的整體設(shè)計如圖1所示，系統(tǒng)采用ThinkPHP作為系統(tǒng)框架。ThinkPHP框架通過建立模型對數(shù)據(jù)進行查詢和篩選并將結(jié)果提交給控制器，控制器實現(xiàn)系統(tǒng)的邏輯運算并調(diào)用相應(yīng)的模版接收邏輯運算結(jié)果；模版被調(diào)用后對數(shù)據(jù)進行加載并調(diào)用Echarts可視化組件將數(shù)據(jù)按照模版預(yù)制的樣式展示出來。

可視化系統(tǒng)主要使用Echarts組件中的坐標(biāo)地圖模塊，對點、線、面數(shù)據(jù)進行樣式和顏色的渲染。其中JavaScript格式的數(shù)據(jù)主要用作背景數(shù)據(jù)的顯示，如行政區(qū)劃邊界；JSON格式的數(shù)據(jù)主要用于各類專題數(shù)據(jù)的展示，如歷史地震、活動斷層等。可視化除了數(shù)據(jù)展示外，還實現(xiàn)了交互操作的功能，根據(jù)用戶對展示頁面的操作實現(xiàn)相應(yīng)的可視化展示。

2 數(shù)據(jù)管理平臺的設(shè)計

數(shù)據(jù)管理平臺是將各類應(yīng)急數(shù)據(jù)進行分類、歸納整理和標(biāo)準(zhǔn)化的技術(shù)平臺[6]，該平臺主要包括數(shù)據(jù)的查詢、更新和共享等功能。本系統(tǒng)主要將數(shù)據(jù)分為三類，一是線、面類型的矢量數(shù)據(jù)；二是點數(shù)據(jù)；三是動態(tài)信息數(shù)據(jù)。線、面類型的數(shù)據(jù)主要用于表示行政區(qū)劃、路網(wǎng)、水系等，一般不需要實時更新，以文本文件的形式存儲。點數(shù)據(jù)一般為單體位置數(shù)據(jù)，以數(shù)據(jù)表單的形式存儲。動態(tài)信息主要是信息節(jié)點數(shù)據(jù)、行業(yè)網(wǎng)狀態(tài)等數(shù)據(jù)，這類數(shù)據(jù)也以數(shù)據(jù)表單的形式存儲。

圖1 地震應(yīng)急可視化系統(tǒng)整體設(shè)計

第一類線、面數(shù)據(jù)以文本文件的形式存儲，存儲格式采用GeoJSON格式。在GeoJSON格式的數(shù)據(jù)中用geometry對象記錄空間矢量類型和地理坐標(biāo)，使用properties對象記錄數(shù)據(jù)的各類屬性。空間數(shù)據(jù)轉(zhuǎn)JSON通過Quantum GIS軟件將shp格式的空間數(shù)據(jù)轉(zhuǎn)換為JSON格式。當(dāng)空間數(shù)據(jù)用于地圖背景時，使用JavaScript格式更為簡便，可以通過Echart自帶的插件將JSON轉(zhuǎn)換為JavaScript格式。第二類和第三類數(shù)據(jù)主要是空間點數(shù)據(jù)和與位置相關(guān)的屬性數(shù)據(jù)，這類數(shù)據(jù)使用帶有經(jīng)緯屬性的表單數(shù)據(jù)存儲。

數(shù)據(jù)管理平臺主要用于管理第二類和第三類數(shù)據(jù)，平臺使用ThinkPHP框架進行開發(fā)，數(shù)據(jù)存儲采用Mysql數(shù)據(jù)庫。數(shù)據(jù)管理平臺中每類數(shù)據(jù)都有一個管理界面和與之對應(yīng)的數(shù)據(jù)表單。在管理界面中可以完成數(shù)據(jù)的瀏覽、查詢和更新。圖2為鄉(xiāng)鎮(zhèn)人口數(shù)據(jù)管理界面，在界面中的檢索框內(nèi)輸入鄉(xiāng)鎮(zhèn)名稱可以檢索出該鄉(xiāng)鎮(zhèn)人口的數(shù)據(jù)表單。菜單欄中的“添加”、“刪除”和“批量刪除”控件可以完成表單的添加、刪除和批量刪除功能。在表單操作欄中，“編輯”控件可以實現(xiàn)對該條數(shù)據(jù)表單內(nèi)容的更新。此外，數(shù)據(jù)管理平臺可以將數(shù)據(jù)以鍵值對數(shù)組的格式導(dǎo)出，直接在數(shù)據(jù)可視化平臺中使用。

3 數(shù)據(jù)可視化設(shè)計

按照數(shù)據(jù)類型分類，應(yīng)急數(shù)據(jù)主要分為空間矢量數(shù)據(jù)和屬性數(shù)據(jù)，所以應(yīng)急數(shù)據(jù)的可視化包括空間數(shù)據(jù)的可視化和屬性數(shù)據(jù)的可視化[7]。而屬性數(shù)據(jù)大多又與空間數(shù)據(jù)強相關(guān)，所以屬性數(shù)據(jù)的可視化設(shè)計要依托空間數(shù)據(jù)的可視化。本文所介紹的地震應(yīng)急可視化系統(tǒng)就是用空間數(shù)據(jù)展示數(shù)據(jù)的位置信息和相對位置關(guān)系，以屬性數(shù)據(jù)的特性來渲染空間數(shù)據(jù)的樣式和顏色。

3.1 點數(shù)據(jù)的可視化設(shè)計

點數(shù)據(jù)的可視化方法是根據(jù)坐標(biāo)直接用標(biāo)記標(biāo)識在地圖上。這種方式好處是占用較小的空間顯示較多的信息，但點數(shù)據(jù)較密集的時候會出現(xiàn)重疊的問題，數(shù)據(jù)的顯示效果不佳[8]。為了解決這一問題本系統(tǒng)在設(shè)計時除了對點的大小、樣式和顏色進行設(shè)計外，還設(shè)計了條件篩選功能，用戶可以根據(jù)特定條件對點數(shù)據(jù)進行篩選，減小用于顯示的點數(shù)據(jù)密度，從而最大限度減小了點數(shù)據(jù)重合的問題。

本系統(tǒng)中主要用點數(shù)據(jù)來展示地震監(jiān)測臺站分布、歷史地震分布、避難場所分布等數(shù)據(jù)。點數(shù)據(jù)主要包括位置信息和其他屬性信息（如歷史地震的震級、臺站的類型、避難場所的等級等）。點數(shù)據(jù)可視化需要建立一個坐標(biāo)數(shù)組，用于存放點數(shù)據(jù)的經(jīng)緯度坐標(biāo)。然后將點數(shù)據(jù)的名稱和坐標(biāo)依次添加到數(shù)組中。最后將點數(shù)據(jù)的數(shù)據(jù)屬性與數(shù)組中對應(yīng)點的名稱綁定。使用坐標(biāo)數(shù)組實現(xiàn)點數(shù)據(jù)位置的標(biāo)定，使用點數(shù)據(jù)的屬性特征來渲染點數(shù)據(jù)的樣式。點數(shù)據(jù)的屬性特征與渲染樣式是通過視覺組件實現(xiàn)的，視覺組件根據(jù)數(shù)據(jù)的某一特定屬性對圖元的圖形類別、圖元的大小、圖元的顏色、圖元及其附屬物的透明度等進行設(shè)定和顯示。

圖2 鄉(xiāng)鎮(zhèn)人口數(shù)據(jù)管理界面

數(shù)據(jù)展示界面中鼠標(biāo)懸停在某個點上時，系統(tǒng)會彈出提示信息對該點進行詳細的說明，如震級、避難場所等級、地震臺站觀測手段等。系統(tǒng)中的提示信息是通過Echarts可視化組件的提示信息控件實現(xiàn)的，該控件通過對提示信息格式化來完成提示信息樣式的設(shè)計。圖3為2009年以來天津及周邊地區(qū)1級以上地震的歷史分布圖。圖中每個點代表一次地震事件，震級越大顏色越深，震級越小顏色越淺。左下角的篩選控件可以按照震級的大小篩選要顯示的地震事件。

圖3 歷史地震分布

3.2 線數(shù)據(jù)的可視化設(shè)計

線數(shù)據(jù)通常是指連接地圖上兩個或更多地點的線段或者路徑[9]。比如地鐵線路、公交線路等。線數(shù)據(jù)具有長度屬性，即所經(jīng)過的地理距離。通過顏色、線條類型、寬度等通道映射不同屬性實現(xiàn)線數(shù)據(jù)的可視化。

本系統(tǒng)中線數(shù)據(jù)主要用于展示公路、鐵路和活動斷層的分布。線數(shù)據(jù)也包括空間信息和屬性信息，其中空間信息用于展示鐵路、公路和活動斷層的分布，屬性信息用于渲染線數(shù)據(jù)的顏色、樣式和線條寬度等。項目中對線數(shù)據(jù)的處理方式是將線數(shù)據(jù)以點集合的方式進行記錄，數(shù)據(jù)存儲格式為GeoJSON，文本中每行記錄一條線段。系統(tǒng)對數(shù)據(jù)存儲文件進行逐行遍歷，通過特征點位的坐標(biāo)判斷線段的名稱，再根據(jù)線段的名稱匹配相關(guān)屬性并通過屬性對線段的樣式和顏色進行渲染。線段的樣式主要通過LineStyle控件來完成，通過該控件實現(xiàn)線段寬度、顏色、透明度等參數(shù)的設(shè)定。

鼠標(biāo)滑動到某條線段上時，系統(tǒng)會彈出提示信息對該線段進行詳細的說明，如鐵路線路名稱、高速公路路段名稱、活動斷層名稱等。系統(tǒng)中的提示信息也是通過Echarts可視化組件實現(xiàn)的。圖3為活動斷層分布圖，圖中黃色線段為天津市行政邊界，紅色線段為轄區(qū)內(nèi)的活動斷層。鼠標(biāo)停留在活動斷層上會彈出該斷層的名稱。圖4中的背景地圖是百度地圖，該地圖是重新定義地圖樣式和顏色后，通過調(diào)用百度地圖API進行調(diào)用的。因為線數(shù)據(jù)是以GeoJSON格式存儲的，所以該數(shù)據(jù)為矢量數(shù)據(jù)，當(dāng)放大地圖時，線數(shù)據(jù)圖形也會隨之放大，不會出現(xiàn)失真的情況。

圖4 活動斷層分布圖

3.3 面數(shù)據(jù)的可視化設(shè)計

面數(shù)據(jù)主要用于表征空間實體的位置、形狀、大小和分布特征等信息[10]。本系統(tǒng)中面數(shù)據(jù)主要用于行政區(qū)域的可視化展示，如以鄉(xiāng)鎮(zhèn)為基礎(chǔ)單元的人口和經(jīng)濟分布等。此外，面數(shù)據(jù)還可以作為背景信息用于可視化的展示，如各類點、線數(shù)據(jù)在可視化展示時的行政邊界背景。

當(dāng)使用面數(shù)據(jù)對某一區(qū)域進行可視化展示時，可以將面數(shù)據(jù)的某一屬性（如人口、經(jīng)濟等）作為渲染條件，按照渲染條件對面數(shù)據(jù)進行樣式和顏色的渲染。系統(tǒng)中對面數(shù)據(jù)的處理方法是將面數(shù)據(jù)中每個單面的名稱與作為渲染條件的屬性數(shù)據(jù)進行一對一映射，再通過視覺映射組件設(shè)定顏色變化范圍和顏色漸變梯度，最終實現(xiàn)面數(shù)據(jù)的可視化展示。圖5為天津人口分布圖（鄉(xiāng)鎮(zhèn)/街道級），圖中使用鄉(xiāng)鎮(zhèn)（街道）人口數(shù)量作為渲染條件，人口越多與之對應(yīng)的行政單元的顏色就越深。當(dāng)使用面數(shù)據(jù)作為背景信息展示時，面數(shù)據(jù)的渲染方式只有選中和未選中兩種，所以可以將GeoJSON格式的面數(shù)據(jù)封裝成JavaScript格式，在頁面加載時通過Echart框架對其調(diào)用，借助頁面前端技術(shù)實現(xiàn)鼠標(biāo)選中和未選中狀態(tài)的判定。當(dāng)鼠標(biāo)停留在某一行政區(qū)域內(nèi)時，與之對應(yīng)的面就會處于選中狀態(tài)，處于選中狀態(tài)的面就會按照渲染樣式和標(biāo)注樣式突出顯示。圖6為我局臺站信息節(jié)點狀態(tài)圖，圖中的背景信息是天津轄區(qū)內(nèi)各個鄉(xiāng)鎮(zhèn)級行政單元，圖中鼠標(biāo)停留在八門城鎮(zhèn)的位置上，該區(qū)域的背景顏色就變?yōu)榘咨伙@出來。

4 結(jié)論與展望

通過天津市地震應(yīng)急數(shù)據(jù)可視化系統(tǒng)的建設(shè)，對天津市地震局目前掌握的應(yīng)急基礎(chǔ)數(shù)據(jù)進行了整理和加工，實現(xiàn)了應(yīng)急基礎(chǔ)數(shù)據(jù)的可視化展示，提升了應(yīng)急數(shù)據(jù)的支撐能力，在地震應(yīng)急指揮調(diào)度和決策判定中可以提供重要的參考依據(jù)。目前系統(tǒng)功能還相對單一，數(shù)據(jù)可視化程度不高，特別是對數(shù)據(jù)關(guān)系的可視化功能還比較薄弱，隨著后續(xù)項目的開展，我們將對數(shù)據(jù)做更深層的分析和處理，為震后應(yīng)急指揮決策提供更加可靠的數(shù)據(jù)支撐。

圖5 天津人口分布圖

圖6 行業(yè)網(wǎng)信息節(jié)點狀態(tài)圖