基于点元素描述多维风浪要素的可视化展示

冀玉超

（东营市气象局，山东 东营 257091）

0 引言

目前主流风向风速的可视化展示均无法快速判断一定时间段内的风向转换和风力变化情况，为了方便用户特别是没有气象背景的用户快速获取本地气象水文过程，开发了基于点元素描述多维风浪要素的可视化展示系统。本文主要对系统设计思路、功能及特点进行阐述。

1 背 景

1.1 现 状

目前，风向和风速曲线展示的方案主要有两种[1]，如图1所示。

图1 风向和风速曲线方案

方案1中，横坐标表示时间，纵坐标代表风力，箭头的指向即表示风的去向。该方案使用频次较高，但存在如下不足之处：不能快速地描述风向转换，当时间轴加密时，箭头会叠加在一起，给风向判断带来一定难度。

方案2中，横坐标为时间，纵坐标分别是风力和风向角度值。该方案使用频次较低，其不足之处是，用户需对风向和角度的对应关系有一定的知识背景和判断过程，不能快速描述风向转换；需结合两个曲线去描述风向风力变化，不够简捷。

1.2 需 求

为了让用户快速获取本地气象水文过程，针对上述两种方案的不足之处，利用HTML5、C#及Microsoft SQL Server技术[2]，开发了基于点元素描述多维风浪要素的可视化展示系统。

2 系统设计

2.1 服务器端

服务器操作系统版本为Windows Server 2008 R2以上版本，IIS采用6.0以上版本，C#为4.0以上版本，使用的数据库为SQL Server 2008以上版本。

2.2 客户端

客户端浏览器端需要支持HTML5，推荐使用Google浏览器。

2.3 工作流程

设计的系统工作流程如图2所示。

图2 系统流程图

3 图形展示

Web界面效果如图3所示。

图3 Web界面效果图

3.1 横坐标

横坐标代表时间轴序列，上面一行代表整时（Hour），下面一行代表日（Day），对应刻度线为浅棕色显示。

设计亮点：能自动伸缩调整时间轴跨度和刻度线密度。

3.2 左侧纵坐标

左侧纵坐标代表风力等级，共设置＜4、4、5、6、7、8、9、10以及＞10共9个等级，对应刻度线为棕色显示。

3.3 右侧纵坐标

右侧纵坐标代表波高值，单位为厘米（cm），对应刻度线为黑色显示。

设计亮点：为实现本地风浪要素较好的相关性[3-4]，根据近10年历史数据求得多年波高和风力的统计关系，进而确定波高量程和刻度线的间隔，避免了波高纵坐标向上过度压缩或拉伸不协调造成的不美观。

3.4 风向色标玫瑰图

遵循“上北下南左西右东”原则[5]，如表1所示。本地海域对偏东、偏北风比较敏感，其对应海况一般较差，因此选用醒目的红、黄色来表示偏东风和偏北风。

表1 风向与颜色的对应关系

设计亮点：创新实现了用像素点元素的颜色属性来表示8个方向的功能，直观、连续性好，能快速判断风向演变情况。

在最大波高曲线中，紫色曲线代表最大波高，即采样周期内最大的一个波高数值。

在有效波高曲线中，灰色曲线代表有效波高，即采样周期内前三分之一显著波高的平均值。

3.5 功能区按钮

功能区包括下拉菜单、单选按钮、文本框、普通按钮以及提交按钮5种控件。“站点”下拉列表包含近海5个滩涂站和2个平台站，在“风向风速”按钮下分别单击“平均”“瞬时”“综合”即可查看平均、三秒瞬时以及综合风向风力，“时间”按 钮 包 括“-240h”“-24h”“-12h”“-6h”“+6h” “+12h”“+24h”“+240h”共8个按钮，单击相应按钮实现整体前进或后退；“单站/多站”按钮可查看单站或多站对应的要素曲线，单击“波浪”按钮可以叠加波浪曲线；“开始时间”文本框用12位时间字符串（格式：yyyyMMddhhmm）表示年月日时分，结合“结束时间”共同实现时间的精准定位；“结束时间”文本框的使用方法同“开始时间”文本框，单击“查看”按钮可查看相应参数对应的要素曲线。

4 功能介绍

4.1 风要素查询

4.1.1 单站点查询

查询单站点瞬时风向风速时，首先选中“单站”按钮，然后选择站点和“瞬时”按钮，输入要查询的开始和结束时间，最后单击“查看”按钮，即可显示瞬时风向风速曲线。单站点平均风向风速查询方法与单站点瞬时风向风速查询方法相同，需选择“平均”按钮；单站点综合风向风速查询方法与单站点瞬时风向风速查询方法相同，需选择“综合”按钮。

4.1.2 多站点查询

进行多站点瞬时风向风速查询时，首先选中“多站”按钮，然后选中“瞬时”按钮和相应多个站点，单击“查看”按钮即可显示多站点瞬时风向风速曲线。多站点平均风向风速查询方法与多站点瞬时风向风速查询方法相同，需选择“多站”“平均”单选按钮。多站点综合风向风速查询方法与多站点瞬时风向风速查询方法相同，需选择“多站”“综合”单选按钮。

4.2 风浪要素综合查询

4.2.1 单站点查询

查询单站点瞬时风向风速和波高时，首先在站点下拉列表中选中站点，然后选中“瞬时”单选按钮，输入要查询的开始时间和结束时间，单击“查看”按钮，系统显示瞬时风向风速曲线，再单击“波高”按钮可叠加波高曲线。

单站点平均风向风速和波高的查询方法与单站点瞬时风向风速和波高查询方法相同，需选择“平均”单选按钮。单站点综合风向风速和波高的查询方法与单站点瞬时风向风速和波高查询方法相同，需选择“综合”单选按钮。

4.2.2 多站点查询

多站点风浪要素综合查询方法和单站点查询方法大致相同。不同之处在于，查询多站点瞬时风向风速和波高时，需选择“多站”“瞬时”单选按钮曲线；查询多站点平均风向风速和波高时，需选择“多站”“平均”单选按钮；查询多站点综合风向风速和波高时，需选择“多站”“综合”单选按钮。

4.3 时间轴快速定位

单 击“+6h”“-6h”“+12h”“-12h”“+24h” “-24h”“+240h”“-240h”按钮，查询时间段整体快进或后退6h、12h、24h、240h，可实现快速前进查询和快速后退查询。

进行精准定位查询时，在“开始时间”和“结束时间”文本框输入12位时间字符串，能实现精准、快速定位查询。

5 结语

系统创新实现了用像素点元素的颜色属性来表示8个不同风向的功能，能快速描述风向、风速及海浪的变化和生消特点。通过Web页面参数设置，可实现任意单站或多站在任意时间段风浪的快速可视化展示。系统实现了浏览器端Web页面上的快速查询，支持电脑、手机及平板等终端。