基于WebGIS的舟山氣象自動站實況顯示系統

張 驍，李 駿，虞佳維，劉壯峰，孫 楠

（舟山市氣象局，浙江 舟山316000）

1 引言

WebGIS（網絡地理信息系統）是指基于網絡平臺，客戶端應用軟件采用網絡協議，運行在網絡上的地理信息系統，即將GIS所能提供的功能通過網絡展現給用戶[1]。WebGIS有利于信息共享，并易于實現數據分布式管理[2]。隨著網絡技術的不斷發展，地理信息系統由C/S（Client/Server客戶機/服務器）架構向網絡環境下的B/S（Browser/Server，瀏覽器/服務器）架構發展。B/S架構具有系統重用性好、分布性強、系統部署維護方便、開發成本較低等優點。

隨著氣象現代化發展的不斷深入，氣象信息化建設的不斷完善。用于對溫度、濕度、風速、氣壓、雨量等眾多氣象要素進行全天候實況監測的自動氣象站覆蓋區域越來越廣。通過地理信息系統的應用將實況要素信息展示出來，從時空分布上了解天氣現狀的發展變化，對于氣象預報員分析天氣形勢、防災減災提供有力的依據和參考。近年來，國內不少學者對基于WebGIS在氣象領域的應用做了大量的分析研究。施海瑞等[2]針對國際公路自行車賽氣象服務現代化的業務需求，基于WebGIS技術手段，將地理空間數據、天氣預報與氣象實況結合進行可視化表達。張紅艷等[3]針對氣象臺站氣象觀測數據基于WebGIS開發了亞運氣象服務在線系統，以直觀形式將實時數據與地理信息結合在一起。季剛等[4]結合WebGIS技術開發建立了自動氣象站數據可視化綜合應用系統，大大提高安徽省自動氣象站數據應用水平，為全省各種氣象業務提供信息支撐。劉旭林等[5]針對北京市氣象局氣象觀測數據，開發了基于WebGIS的氣象信息發布系統，該系統為預報工作提供了及時、有效、科學的輔助決策支持。

2 系統開發設計

2.1 系統結構設計

舟山氣象自動站實況顯示系統的整體架構如圖1所示。前端應用層是系統用戶直接操作的客戶端頁面，涉及舟山氣象自動站站點名稱顯示、實況氣象要素數據分時顯示等功能。氣象業務人員可以通過該系統界面實現對實況氣象資料進行直觀監測分析，對比驗證數值模式預報結果的準確性，進一步提高工作效率。該系統以離線公共地圖數據、氣象信息相關業務數據為基礎，前端使用Bootstrap前端開源框架，OpenLayers 3框架，后臺使用Asp.NET體系框架，數據庫使用Microsoft SQL Server 2008，系統后臺數據服務采用ADO.NET技術訪問業務數據庫，實現數據庫的交互，通過Ajax技術實現前端和后端數據交互，數據結果將以JSON格式返回前端。第三方JS資源涉及jQuery、Bootstrap等。構建一個涵蓋地圖顯示和基本操作、實況氣象要素信息實時監測、歷史信息多樣化展示等功能的WebGIS系統。

圖1 舟山氣象自動站實況顯示系統整體架構

2.2 數據庫設計

數據庫使用Microsoft SQL Server 2008，使用SQL語句對自動站氣象實況數據進行操縱控制，建立不同數據庫之間的聯系。圖2為舟山氣象自動站實況顯示系統數據庫E-R圖，主鍵為自動站站號，數據庫資料由自動站小時資料、自動站站點信息、自動站分鐘資料組成。

圖2 數據庫E-R圖

2.3 系統功能設計

本系統建設密切聯系氣象服務的實際業務需求，綜合利用舟山氣象局自動站各氣象要素實況、站點信息等資料，更好地從空間、時間上將實況氣象要素數據分時顯示，便于實時查詢統計，地圖標注定位可以直觀地掌握每個測站的氣象要素狀況。

具體實現功能如下：①地圖常規操作。涉及離線地圖的顯示，地圖的縮放拖拽以及不同類型底圖的切換。②氣象各要素實況資料的顯示。對接舟山市氣象局氣象資料數據庫接口，分小時、5 min資料實時顯示實況氣象要素，其中氣象要素包括氣溫、雨量、氣壓、水氣壓、濕度、露點溫度、風向、風速等。可勾選是否疊加顯示各氣象自動站站名。③回看歷史時次各要素資料情況，可查詢指定站點各要素實況。④點擊站點可展示近9 h實況數據，給出統計數據的不同可視化形式。系統功能效果如圖3所示。

圖3 系統功能效果圖

3 系統開發主要技術

3.1 離線公共地圖數據的加載

公共地圖數據是指網絡上涌現的大量地圖服務資源，提供免費開放的基礎地圖服務，一般均為瓦片地圖形式，常在應用中作為地圖直接調用，如圖4所示。瓦片地圖都是基于金字塔策略裁剪后的圖片集，因此瓦片地圖由級數、行列號對應的單張圖片按照網格劃分組織而成[1]。自動站實況顯示系統部署于業務內網，需要加載高德離線地圖作為底圖，采用Openlayers加載離線瓦片地圖的形式加載地圖底圖，底圖可在矢量地圖、衛星地圖、地形地圖中切換。

圖4 加載離線地圖

3.2 WebUI技術

在設計基于B/S架構系統時，經常會遇到不同瀏覽器兼容性和不同尺寸設備的顯示問題。而響應式布局可以為不同終端的用戶提供更加舒適的界面和更好的用戶體驗，該布局具有面對不同分辨率設備靈活性強，能夠快捷解決多設備顯示適應問題的優點。本系統采用Bootstrap提供了一套響應式、移動設備優先的流式柵格系統，隨著屏幕或視口尺寸的增加，系統會自動分為最多12列，它還包含了易于使用的預定義類。Bootstrap框架中的網格系統實現原理是通過定義容器大小，平分12份，再調整內外邊距，最后結合媒體查詢，就制作出了強大的響應式網格系統，如圖5所示。響應式網格系統隨著屏幕或視口（viewport）尺寸的增加，系統會自動分為最多12列。

圖5 Bootstrap框架的網格系統工作原理

4 結語

本文設計的舟山氣象自動站實況顯示系統基于WebGIS和B/S架構開發，采用的主要技術包括WebUI、ADO.NET、Ajax等，系統基于模塊化方式進行開發，有效降低了系統體量，提升了加載效率。以jQuery的JavaScript腳本為核心，確保了系統的靈活性、可擴展性，便于后期的維護。系統實現了基于WebGIS的自動站實況數據可視化監測顯示。系統功能將在應用到業務中后繼續增加調整，該系統為氣象業務人員分析天氣形勢、防災減災提供有力的依據和參考，同時也為氣象自動站資料數據的監控提供可靠及時的保障。