基于WPF的氣象信息系統的開發和實現

吳孟春 朱景 周捷 朱忠勇

(1.溫州市氣象局，浙江溫州， 325027；2.文成縣氣象局，浙江文成 325300)

基于WPF的氣象信息系統的開發和實現

吳孟春1朱景2周捷1朱忠勇1

(1.溫州市氣象局，浙江溫州， 325027；2.文成縣氣象局，浙江文成 325300)

為了更好地展示氣象信息發布的效果,采用微軟新一代界面開發技術WPF，并結合商業圖表控件，開發了一套圖形化氣象信息顯示系統。與以往簡單的文本模式的發布平臺相比，通過WPF實現的圖形化界面,不僅使用戶可以實時掌握氣象信息，而且能直觀地了解氣象要素的動態變化趨勢和過程，有著更好的顯示效果。本文重點給出了圖形化的虛擬溫度計、能見度儀表、溫度和雨量的動態曲線及后臺數據的Web Server的設計和開發過程，并給出了相應的代碼。

WPF；Telerik控件；Visifire控件；虛擬氣象儀器；Web Service

0 引 言

近幾年，隨著極端氣象災害性天氣的不斷增多，社會公眾對氣象信息的需求也在不斷增多。氣象部門加大了氣象業務的建設，不斷拓展氣象信息的發布渠道，以便在突發氣象災害發生時，公眾能快速獲取氣象預警信息。互聯網、傳統媒體、手機終端都是信息發布的主要途徑，而安裝在社區、公共場所的終端及信息機是氣象信息展示和發布的新平臺，可顯示氣象臺發布的最新的預警信息、天氣實況及天氣預報等，是對原信息發布渠道的補充和拓展。

本文利用流行的WPF技術開發了虛擬氣象儀器、動態圖表來顯示實時的氣象信息，應用于高清終端和信息機上，有著很好的視覺效果。

1 WPF技術

1.1 WFP簡介

WPF是Windows Presentation Foundation 簡寫，是微軟新一代圖形系統，提供了豐富的.NET界面設計框架，驚艷的動畫設計和觸摸技術，用于生成能帶給用戶震撼視覺體驗的 Windows 客戶端應用程序[1]。使用 WPF，可以創建廣泛的獨立應用程序以及瀏覽器承載的應用程序。WPF所使用開發語言為XAML[2](eXtensible Application Markup Language，可擴展應用程序標記語言)，是一種新的基于XML的描述性語言。您可以使用任何一種.Net編程語言(C#，VB NET等開發語言)進行開發。XAML的界面描述代碼和后臺的控制語言代碼分開，即前面界面可由美工設計，后臺的代碼可由程序設計師來寫，從而提高了開發效率并有利于團隊開發[4-5]。

1.2 應用優勢

1)設計人員和開發人員的分開是WFP優點，同時WFP的動畫功能也是最吸引人的特色之一，其動畫播放并與程序邏輯進行很好的交互，功能強，應用方便，應用這個功能，可以實現氣象信息滾動播出。

2)WPF提供了統一的 UI 平臺，只需掌握一個模式，就可以實現無限可能的 UI 體驗。

3)通過提供能夠快速提供更好的視覺效果、獨特的用戶體驗的技術和強大數據交互功能，可以實現氣象信息在一個全新的多媒體交互圖形界面上展示。

2 設計思路

氣象信息系統所要顯示的主要內容有:溫濕度、雨量、能見度、風向、風速、天氣預報、預警信息以及12小時氣溫和雨量的變化過程。氣象儀器如溫濕度、雨量、能見度、風向、風速可進行圖形化設計；天氣預報和預警信息可滾動顯示；12小時氣溫和雨量的變化過程則通過曲線和柱狀圖動態變化顯示。

開發中應用了Telerik 控件和Visifire控件。Telerik 控件能開發豐富美觀的桌面應用程序，用于創建溫濕度、雨量等虛擬的氣象儀表圖形；Visifire3能創建數據可視化的動態圖表控件，可用于創建氣溫和雨量數據的動態變化過程。今天天氣欄用文本組件顯示天氣預報，最下方滾動顯示預警信息，則應用WPF的動畫技術。系統的整體布局如圖1所示。

圖1 系統整體布局

3 系統的開發設計

本系統主要是以圖表、文本方式展示天氣預報、天氣實況要素，來展示所在地的氣象信息。天氣預報應用文本控件，滾動的預警信息應用WPF的動畫功能。

3.1 虛擬氣象儀器的開發設計

3.1.1 引用命名空間

xmlns:telerik=“http://schemas.telerik.com/2008/xaml/presentation”

xmlns:c=“clr-namespace:Visifire.Charts;assembly=WPFVisifire.Charts”

3.1.2 虛擬儀表設計

以溫度計為例。需要在溫度計的圖形上繪出刻度和水銀柱，如圖2所示。用到的方法為telerik:LinearScale和telerik:LinearBar。相應代碼如下 ：

Style=“{StaticResource ThermometerBarStyle}” />

圖2 虛擬溫度計

3.2 氣溫、雨量的動態實現

氣溫、雨量除了顯示實時的數據外，通常還要展示其在某個時間段的變化過程。Visifire控件在曲線和柱狀圖等表現方面有著驚艷的視覺效果，故應用Visifire控件來展示氣溫、雨量數據。

3.2.1 前臺XAML代碼

引用Visifire3的Chart控件，加載chart的XAML代碼如下，

后臺加載數據的C#代碼：

//綁定Chart

DataPoint datapoint=null; //定義數據點

DataSeries dataSeries1=new DataSeries();//雨量數據系列

dataSeries1.RenderAs=RenderAs.Column;//雨量柱狀

dataSeries1.LabelText=“#YValue”;

datapoint=new DataPoint();

datapoint.AxisXLabel=stime;//X軸時間點

在閱讀教學中，學生的“說”，除了表現在回答問題外，還表現在小組討論的合作學習中。小組討論，指的是在教師的指導下，通過眾多的學生之間的對話，相互交流，實現教學目標的一種方法。

datapoint.YValue=

Convert.ToDouble(dtChart.Rows[i][“Precipitation”].ToString()); //Y軸

dataSeries1.DataPoints.Add(datapoint);// 數據點添加到數據系列

dataSeries1.LegendText=“雨量(mm)”;//圖例顯示的信息

this.DataChart.Series.Add(dataSeries1); //添加到圖表

//增加溫度數據

……

title.Text=“12小時溫度(°C)、雨量(mm)變化圖”;

this.DataChart.ShadowEnabled=true;

3.2.2 數據交互

數據交互應用Web Service。Web Service服務是遠程數據調用最常用的一種數據接口，常被定義為一組模塊化的API，可通過網絡進行調用，來執行遠程系統的請求服務，并返回用戶所需的數據集、XML或JOSN格式數據。

1) 建立Web Service數據接口。Web Service是通過連接數據庫，執行查詢返回所需數據，并填充到DataSet中。

2)在前臺應用程序中需添加服務引用，即在程序中添加Add Service References 服務引用，加入Web Service數據接口，為Chart提供數據。

在構建后臺的數據服務后，運行的整體效果如圖3所示。

圖3 系統整體效果圖

3.3 預報信息的動態顯示

前端主要應用WPF的動畫功能來實現，在WPF中我們采用Storyboard(故事板)的方式來編寫動畫。

1)顯示形式

在界面的底端，以文字信息從右向左緩慢移動顯示，并加載些圖標，如預警信號等。

2)實現方式

建立數據接口和配置文件，當有數據更新時，觸發信息的實時更新和顯示，應用于各類預警信息的發布。

4 結 語

應用WPF的圖形技術開發的應用系統的界面具有超強的視覺效果。本文應用WPF的編程模型、語言和框架，結合儀表控件，開發了虛擬的氣象儀器；結合曲線控件，開發了氣象要素的動態顯示；通過WPF動畫功能可讓信息滾動顯示，讓用戶更直觀更快捷地掌握當地最新的氣象信息的同時，有著更好的視覺體驗。本系統已用于文成氣象局的大屏監控平臺，可擴展建立后臺更多的數據推送服務，并通過配置站點文件可讓多站點輪詢顯示。后期還將加入GIS功能，結合WPF的觸摸技術用于觸摸屏，點擊站點，可顯示站點的氣象信息。

[1] http://www.cnblogs.com/xdotnet/archive/2009/01/09/wpf_1.html.

[2] [美]Matthew MacDonald；王德才(譯).WPF編程寶典(C#2010版)[M]. 北京：清華大學出版社, 2011.

[3] http://www.cnblogs.com/xinweichen/archive/2011/12/08/2280447.html.

[4] 劉鐵猛.深入淺出WPF[M].北京：中國水利水電出版社，2010.

[5] 陳鄭軍，劉振東，胡方霞，等.WPF應用開發項目教程[M].北京：中國水利水電出版社,2015.

2016-08-02