曾 悠，楊 明

（浙江省氣象信息網(wǎng)絡(luò)中心，浙江杭州 310017）

0 引言

氣象數(shù)據(jù)分析與應(yīng)用成為大數(shù)據(jù)研究的熱門(mén)領(lǐng)域之一［1］。在海量氣象數(shù)據(jù)挖掘基礎(chǔ)上，氣象數(shù)據(jù)的可視化將極大提高數(shù)據(jù)分析效率，而前端的架構(gòu)設(shè)計(jì)對(duì)于優(yōu)化可視化效果及后續(xù)工作的高效開(kāi)展具有十分重要的意義［2-6］。目前氣象可視化系統(tǒng)多基于Silverlight 和WebGIS 技術(shù)［7-10］，但Silverlight 使用前必須安裝插件且使用成本較高，基于WebGIS 的可視化功能往往不能單獨(dú)使用；采用基于GIS 的ArcEngine 模式開(kāi)發(fā)的可視化地圖組件［11-12］具有針對(duì)性和專(zhuān)屬性，不便于移植到其他系統(tǒng)或平臺(tái)。20 世紀(jì)70 年代，MVC 模式在Smalltalk-80 的GUI 設(shè)計(jì)中被提出［13］。本文基于氣象云平臺(tái)的數(shù)據(jù)可視化組件，采用MVC（Model-View-Controller）設(shè)計(jì)模式［14］，分析整合多種氣象數(shù)據(jù)源，以組件形式提供氣象數(shù)據(jù)綜合展示、氣象設(shè)備監(jiān)控預(yù)警、氣象應(yīng)用在線(xiàn)分享等功能，實(shí)現(xiàn)氣象數(shù)據(jù)的有效可視化，具有較強(qiáng)的可擴(kuò)展性和可移植性。

1 框架設(shè)計(jì)

面向復(fù)雜多維的氣象數(shù)據(jù)和可視化需求，本文數(shù)據(jù)可視化組件采用MVC 三層框架模式設(shè)計(jì)思想?？蚣艿囊晥D層、數(shù)據(jù)模型層和邏輯控制層相互獨(dú)立，將不同的功能分配給相應(yīng)的層實(shí)現(xiàn)。視圖（View）主要用于實(shí)現(xiàn)頁(yè)面展示，數(shù)據(jù)模型（Model）負(fù)責(zé)數(shù)據(jù)的訪問(wèn)和調(diào)用，邏輯控制層（Controller）實(shí)現(xiàn)組件系統(tǒng)的業(yè)務(wù)邏輯、協(xié)調(diào)視圖與模型［15-19］，應(yīng)用服務(wù)則在三者基礎(chǔ)上實(shí)現(xiàn)，其功能架構(gòu)如圖1所示。三層架構(gòu)模式實(shí)現(xiàn)的系統(tǒng)能極大降低程序間的耦合性，增強(qiáng)組件的伸縮性、穩(wěn)定性，便于組件擴(kuò)展和維護(hù)［20］。

Fig.1 Functional architecture of visual application components圖1 可視化應(yīng)用組件功能架構(gòu)

（1）視圖層。是用戶(hù)和組件系統(tǒng)的交互窗口，負(fù)責(zé)獲取用戶(hù)指示和顯示控制層反饋的數(shù)據(jù)信息，采用HTML5、CSS3 和JavaScript 等Web 前端技術(shù)完成應(yīng)用組件的內(nèi)容布局，結(jié)合地圖模塊的WebGIS 技術(shù)實(shí)現(xiàn)在互聯(lián)網(wǎng)平臺(tái)上進(jìn)行地理信息發(fā)布、交流協(xié)作和數(shù)據(jù)共享。在視圖層使用Ja?vaScript 和WebGIS 技術(shù)開(kāi)發(fā)交互界面，不但能支撐多種數(shù)據(jù)類(lèi)型的分析展示，提供圖表、地圖、空間數(shù)據(jù)等多種可視化風(fēng)格，實(shí)現(xiàn)用戶(hù)自定義的操作界面風(fēng)格制定，還能適配PC 端、移動(dòng)端和大屏等多種分辨率的本地部署和多終端展示。

（2）數(shù)據(jù)模型層。以分布式云存儲(chǔ)技術(shù)、數(shù)據(jù)中心技術(shù)為支撐，負(fù)責(zé)數(shù)據(jù)的存取，包括數(shù)據(jù)表的插入、更新、刪除、查詢(xún)等操作，為控制層提供數(shù)據(jù)服務(wù)。數(shù)據(jù)模型層主要由數(shù)據(jù)持久化模塊、數(shù)據(jù)訪問(wèn)模塊、數(shù)據(jù)消息模塊、數(shù)據(jù)處理和數(shù)據(jù)服務(wù)模塊組成。根據(jù)業(yè)務(wù)邏輯訪問(wèn)相應(yīng)的氣象數(shù)據(jù)，通過(guò)數(shù)據(jù)處理模塊進(jìn)行數(shù)據(jù)轉(zhuǎn)換，提供通用的JSON、Txt、二進(jìn)制流等數(shù)據(jù)格式以及相應(yīng)數(shù)據(jù)接口［21］，兼容多種數(shù)據(jù)格式，實(shí)現(xiàn)與各氣象數(shù)據(jù)應(yīng)用平臺(tái)無(wú)縫對(duì)接。

（3）邏輯控制層。為系統(tǒng)核心層，負(fù)責(zé)可視化的業(yè)務(wù)邏輯實(shí)現(xiàn)、消息控制和數(shù)據(jù)通信等。主要由數(shù)據(jù)通信模塊、消息控制模塊、業(yè)務(wù)組件管理模塊組成。從視圖層獲取用戶(hù)指示后，依據(jù)業(yè)務(wù)規(guī)則處理數(shù)據(jù)，調(diào)用數(shù)據(jù)模型層提供的接口完成數(shù)據(jù)的存儲(chǔ)和訪問(wèn)，通過(guò)消息控制模塊實(shí)現(xiàn)業(yè)務(wù)邏輯管控，為視圖層提供豐富的業(yè)務(wù)邏輯組件。邏輯控制層提供多種通用的數(shù)據(jù)解析顯示方式和圖表面板，用戶(hù)可根據(jù)自身業(yè)務(wù)需求和業(yè)務(wù)邏輯獲取數(shù)據(jù)和圖表。

應(yīng)用服務(wù)采用分布式方式為業(yè)務(wù)應(yīng)用提供服務(wù)，主要分為地圖應(yīng)用服務(wù)、圖表應(yīng)用服務(wù)、專(zhuān)題應(yīng)用服務(wù)、可視化組件應(yīng)用服務(wù)等。采取在線(xiàn)和離線(xiàn)方式為業(yè)務(wù)系統(tǒng)提供應(yīng)用服務(wù)，用戶(hù)也可創(chuàng)建個(gè)性化的氣象應(yīng)用服務(wù)并發(fā)布及分享。

2 關(guān)鍵技術(shù)分析

2.1 消息機(jī)制模型

氣象可視化內(nèi)部采用同步和異步兩種消息機(jī)制混合方式，按照系統(tǒng)內(nèi)部與外部劃分邊界，即可視化服務(wù)內(nèi)部采用同步工作流消息方式，與外部請(qǐng)求交互采用異步的消息方式。整個(gè)氣象可視化服務(wù)組件內(nèi)部分為執(zhí)行體和消息體兩個(gè)實(shí)體。

為了提高用戶(hù)體驗(yàn)，在面向用戶(hù)的可視化組件視圖層采用異步的消息方式響應(yīng)用戶(hù)的可視化請(qǐng)求，并在向業(yè)務(wù)邏輯層發(fā)送業(yè)務(wù)處理請(qǐng)求的同時(shí)響應(yīng)用戶(hù)的其他可視化請(qǐng)求。在業(yè)務(wù)邏輯層，由于可視化請(qǐng)求邏輯處理采用工作流方式，每項(xiàng)任務(wù)都是按照可視化業(yè)務(wù)邏輯按序執(zhí)行，所以采用消息同步方式。同樣，在數(shù)據(jù)模型層采用同步的消息方式，而在數(shù)據(jù)模型層請(qǐng)求外部數(shù)據(jù)服務(wù)時(shí)采用異步消息機(jī)制。消息機(jī)制模型如圖2 所示。采用混合消息機(jī)制模型可實(shí)現(xiàn)氣象可視化組件的有序服務(wù)，提高用戶(hù)體驗(yàn)和響應(yīng)效率，有利于擴(kuò)展新功能、消除并發(fā)訪問(wèn)高峰、提高系統(tǒng)可用性。

Fig.2 Synchronous and asynchronous message mechanism model圖2 同步、異步消息機(jī)制模型

2.2 邏輯結(jié)構(gòu)

可視化應(yīng)用組件建立在浙江省氣象數(shù)字化平臺(tái)的數(shù)據(jù)平臺(tái)和地圖模塊之上，提供通用的數(shù)據(jù)格式，獲取并解析氣象站點(diǎn)、網(wǎng)格、圖片、文本等多種格式數(shù)據(jù)，支持本地部署和多終端展示，能自適應(yīng)PC、大屏和移動(dòng)端等屏幕分辨率，做到向下兼容氣象云大數(shù)據(jù)平臺(tái)，向上自適應(yīng)多種屏幕分辨率，其邏輯結(jié)構(gòu)如圖3 所示。

Fig.3 Logical structure of visual application components圖3 可視化應(yīng)用組件邏輯結(jié)構(gòu)

3 基于分布式技術(shù)的可視化組件

3.1 可視化組件開(kāi)發(fā)技術(shù)

基于分布式服務(wù)思想，氣象數(shù)據(jù)可視化組件開(kāi)發(fā)將業(yè)務(wù)和可復(fù)用服務(wù)分離，方便部署且易于氣象產(chǎn)品的二次開(kāi)發(fā)和移植。采用分布式服務(wù)架構(gòu)方式開(kāi)發(fā)可視化組件，有利于適應(yīng)海量數(shù)據(jù)存儲(chǔ)、響應(yīng)速度、后期業(yè)務(wù)擴(kuò)展等需求［22］，其邏輯結(jié)構(gòu)如圖4 所示。

Fig.4 Logical structure of meteorological data visualization component圖4 氣象數(shù)據(jù)可視化組件邏輯結(jié)構(gòu)

氣象數(shù)據(jù)可視化組件以氣象云大數(shù)據(jù)平臺(tái)為數(shù)據(jù)支撐，利用分布式云數(shù)據(jù)存儲(chǔ)技術(shù)，結(jié)合地圖服務(wù)和氣象業(yè)務(wù)需求，形成各個(gè)功能獨(dú)立的組件服務(wù)，以滿(mǎn)足各氣象業(yè)務(wù)系統(tǒng)、各終端展示及其他面對(duì)公眾的氣象服務(wù)需求［23-24］。

氣象數(shù)據(jù)可視化組件負(fù)責(zé)提供不同種類(lèi)的可視化組件服務(wù)，包括地圖服務(wù)中的地圖引擎、地圖操作，負(fù)責(zé)地圖的顯示、加載與操作；氣象渲染、格點(diǎn)訂正、分析圖表、氣象編碼、抽取引擎、智能挖掘則屬于基礎(chǔ)的氣象數(shù)據(jù)服務(wù)，負(fù)責(zé)數(shù)據(jù)編碼、圖層渲染、圖表生成等工作；前端模板組件負(fù)責(zé)直接與用戶(hù)交互的顯示模塊，如提供多種數(shù)據(jù)圖表的樣式以及界面外觀等。以分布式服務(wù)架構(gòu)思想將這些組件服務(wù)作為中間件按需進(jìn)行自由組合、相互搭配使用，更靈活、便捷地為氣象系統(tǒng)提供服務(wù)，還可為新業(yè)務(wù)的二次開(kāi)發(fā)提供獨(dú)立調(diào)用、可重用的組件服務(wù)。

3.2 可視化數(shù)據(jù)插值方法

本文可視化數(shù)據(jù)插值采用雙線(xiàn)性插值方法，與其他的鄰近插值、雙三次插值方法相比，其運(yùn)算速度和插值效果更優(yōu)。其原理是利用源圖像中每個(gè)點(diǎn)周?chē)? 個(gè)真實(shí)點(diǎn)的像素值來(lái)共同生成目標(biāo)圖像中對(duì)應(yīng)點(diǎn)的像素值。在實(shí)際算法中，對(duì)齊源圖像和目標(biāo)圖像的幾何中心，以及使用整數(shù)代替浮點(diǎn)運(yùn)算，能加速與優(yōu)化算法。

3.3 基于HTML5 的Web 可視化技術(shù)

HTML5 提供的HTML、CSS、JavaScript 和SVG 等技術(shù)應(yīng)用廣泛，為實(shí)現(xiàn)高效的數(shù)據(jù)可視化提供了更多機(jī)遇。SVG是基于XML 的一種描述二維矢量圖形格式，因?yàn)槭鞘噶康?，所以被放大后也不?huì)失真，這對(duì)于可視化效果適配不同屏幕大小的終端來(lái)說(shuō)非常有優(yōu)勢(shì)［25］。此外，SVG 圖形可以任意組裝，通過(guò)CSS 和JavaScript 對(duì)圖形進(jìn)行修改［26］。基于HTML5 提供的API，數(shù)據(jù)經(jīng)過(guò)預(yù)處理后由服務(wù)端以JA?SON 格式傳輸給瀏覽器，在客戶(hù)端實(shí)現(xiàn)繪制，完成氣象數(shù)據(jù)的可視化過(guò)程。

4 性能分析

4.1 數(shù)據(jù)說(shuō)明

本文選取部分具有代表性的數(shù)據(jù)為例，其中近24h 降水量為站點(diǎn)數(shù)據(jù)，10UV 分量為網(wǎng)格類(lèi)數(shù)據(jù)，雷達(dá)拼圖和FY4A 為柵格類(lèi)數(shù)據(jù)，如表1 所示。

Table 1 Data description表1 數(shù)據(jù)說(shuō)明

4.2 性能分析

以Jemeter 為測(cè)試工具，從平臺(tái)響應(yīng)速度方面對(duì)氣象數(shù)據(jù)可視化應(yīng)用組件進(jìn)行評(píng)估，測(cè)試10 次請(qǐng)求下的響應(yīng)速度并求出平均響應(yīng)時(shí)間，實(shí)驗(yàn)結(jié)果如圖5 所示。

Fig.5 Comparison of test results of various data responses圖5 各類(lèi)數(shù)據(jù)響應(yīng)測(cè)試結(jié)果對(duì)比

圖5 中橫軸表示實(shí)驗(yàn)次數(shù)，縱軸為響應(yīng)速度，單位為ms（毫秒）。圖5（a）中近24h 降水量在前5 次接近平均值，在第6 次時(shí)耗時(shí)最長(zhǎng)接近80ms，第8 次達(dá)到最小值接近10ms，平均速度30ms，總體表現(xiàn)良好；圖5（b）展示了雷達(dá)拼圖產(chǎn)品響應(yīng)測(cè)試結(jié)果，是4 類(lèi)產(chǎn)品中響應(yīng)速度最穩(wěn)定的，幾乎都在12ms 左右，表現(xiàn)最好；圖5（c）為10UV 分量響應(yīng)測(cè)試結(jié)果，最低響應(yīng)速度50ms，最慢約95ms，平均68ms，響應(yīng)速度的穩(wěn)定性稍遜于其他3 類(lèi)產(chǎn)品；圖5（d）為FY4A 產(chǎn)品響應(yīng)測(cè)試結(jié)果，稍?xún)?yōu)于10UV 分量，最快反應(yīng)速度約18ms，平均值為30ms。

實(shí)驗(yàn)表明，浙江氣象數(shù)字化平臺(tái)可視化應(yīng)用組件在數(shù)據(jù)請(qǐng)求響應(yīng)方面表現(xiàn)良好，具有較快的響應(yīng)速度、渲染速度，符合用戶(hù)預(yù)期。

5 應(yīng)用效果

氣象可視化組件現(xiàn)已應(yīng)用于浙江臺(tái)風(fēng)網(wǎng)、浙江氣象防災(zāi)減災(zāi)決策服務(wù)平臺(tái)等氣象業(yè)務(wù)系統(tǒng)，運(yùn)行情況良好，對(duì)各類(lèi)數(shù)據(jù)處理穩(wěn)定，數(shù)據(jù)顯示層次分明、準(zhǔn)確流暢，用戶(hù)體驗(yàn)較好，達(dá)到了良好的展示效果。

6 結(jié)語(yǔ)

本文運(yùn)用MVC 三層分布式組件開(kāi)發(fā)技術(shù)對(duì)多層氣象數(shù)據(jù)可視化實(shí)現(xiàn)進(jìn)行了研究，介紹了氣象數(shù)據(jù)可視化的功能架構(gòu)，對(duì)可視化組件的混合消息機(jī)制、氣象數(shù)據(jù)可視化組件開(kāi)發(fā)技術(shù)以及前端實(shí)現(xiàn)技術(shù)等關(guān)鍵技術(shù)進(jìn)行了探究。實(shí)際應(yīng)用表明，本文的氣象數(shù)據(jù)可視化方案達(dá)到了應(yīng)用要求，在一定程度上滿(mǎn)足了氣象業(yè)務(wù)對(duì)可視化組件靈活性、可移植性要求，為其他業(yè)務(wù)提供了便捷，為氣象業(yè)務(wù)可視化建設(shè)提供了前瞻性的試驗(yàn)和探索。隨著氣象業(yè)務(wù)的發(fā)展，對(duì)數(shù)據(jù)可視化要求會(huì)逐步提高，該組件功能也將不斷迭代更新與完善。