基于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