基于Ajax的VHF数据综合显示系统设计与实现

钱 良，徐玉锋

(中国卫星海上测控部，江苏江阴214431)

0 引言

船载天地超短波通信系统在设计时就加入了对主要设备的监控功能，并将监控数据记录到数据库中。监控数据包括设备状态和外部数据两部分，前者记录了设备各分系统的电压、频率和状态指示等数据;后者记录了外部引导数据和监控中心指令等数据［1］。但是系统的操作软件在查询相关数据时只以简单的表格形式显示，由于数据量巨大(单项数据每个圈次大约150条记录)，使用者根据监控数据难以迅速地判断出设备的工作状态，同时，监控所记录的数据为设备的原始数据，缺乏对数据的进一步处理，使用者必须自行对数据进行分析判断，效率低下，对使用者的工作经验也提出了较高的要求;另一方面，由于监控数据记录在VHF通信系统的监控计算机上，查询时也只能在该计算机上执行，查询时较为不便。

1 改造思路

目前VHF系统监控功能的不足，使其无法发挥出数据监控应有的作用，因此，需要加强数据查询功能，增加对数据的处理功能，有必要建立一套能够有效利用设备监控数据的系统，帮助岗位人员了解设备状态，做出正确的判断。

项目主要需要实现以下几个目标:①实现设备相关监控数据的网络化查询;②依据指标监视设备参数状态，出现异常则发出告警;③ 实现监控数据的图形化显示;④为日后接入试验任务IP网，预留通信接口;⑤具有较强的通用性，易于扩展，方便移植;⑥有效地利用网络带宽。

该系统的建立将有效地帮助岗位人员全面地掌握设备情况，迅速判断出VHF通信系统所处状态，并且能够实现对天地超短波通信系统设备状态的远程监视，便于技术专家远程监视设备状态，发现安全隐患，并根据状态参数做出诊断。系统所预留的通信接口也为其日后接入基地试验任务IP网打下了基础。

2 实现方案

2.1 系统连接关系

VHF数据综合显示系统主要用于对VHF天地超短波通信系统的伺服参数、设备状态数据等的远程监视。VHF天地超短波通信系统将监控数据发送到综合显示系统。综合显示系统对接收到的监控数据进行选择、处理，将其转化为XML数据，同时将实际数据与相应的指标进行对比，判断设备状态是否正常，若异常则发出告警。远程监控终端通过局域网访问综合显示系统，从而在其浏览器上通过柱状图、饼图、线图来监视VHF设备的状态。从而实现了对VHF天地超短波通信系统进行远程监视，提高了对设备的远程监视和诊断的能力，具体连接关系如图1所示。

图1 系统连接关系

2.2 系统结构组成

VHF数据综合显示系统分为数据源、中间层和显示层3个层次。数据源包含了VHF通信系统监控分系统所记录的设备监控数据;中间层主要完成对所需数据的选择和处理，生成符合规范的XML数据，其中的通信接口负责与外界进行通信［2，3］(如上报重要设备信息等);显示层包含了2个部分:用户界面和图形化显示，其中，图形化显示是本系统的重点和难点。系统层次结构如图2所示。

图2 系统层次关系

2.2.1 数据源

数据源层包括:伺服、发射机、接收机、保密机、复分接器和设备频率的监控数据，这些数据反映了VHF天地超短波通信系统的工作状态。各状态具体意义如下:

①伺服状态:伺服在各时间点的方位角、俯仰角、伺服操作方式(程序引导、数字引导、模拟引导、手动跟踪)和设备自检状态。

②发射机状态:发射机在各时间点的发射功率、反射功率、基带电平状态。

③接收机状态:接收机在各时间点的解扩锁定状态、解调锁定状态、中频放大电压值。

④保密机状态:保密机在各时间点的明话/密话状态、同步状态、主备用情况。

⑤复分接器状态:复分接器在各时间点的同步状态、飞船同步状态、主备用情况，一机和二机的工作状态。

⑥频率:各时间点的发射频率和本振频率。

数据源层负责根据用户的需求将相关的数据从数据库中提取出来。系统在实际使用中通过不同的参数进行数据的选择，主要参数包括:需要检查的设备、检查的项目和圈次。系统由这些参数生成对应的数据库查询语句，数据库查询语句在数据库执行后即返回对应的数据。

2.2.2 中间层

中间层负责将从数据源获得的数据进行处理，并按照制定好的格式填写到XML文件中，完成之后发往终端用户［4－6］。中间层使用了 Ajax技术，Ajax全称为“Asynchronous JavaScript and XML”(异步JavaScript和XML)，是一种创建交互式网页应用的网页开发技术［7］，是传统WEB应用程序的一个转变，Ajax应用可以仅向服务器发送并取回必需的数据，使得在服务器和浏览器之间交换的数据大量减少，结果就能使响应更加迅速，从而能够有效地节约网络带宽，在系统的数据传输过程中，所传内容主要是参数和XML数据，在获取数据之后，页面也仅对需要更新的部分进行更新，确保了数据交互的高效率。

中间层主要分为数据选择模块、数据处理模块、XML转换模块和通信接口模块。

①数据选择模块依据用户要求查看的设备，将相应的监控数据从数据源中选出，传递给数据处理模块。

②数据处理模块从数据选择模块接收相应的数据，并对数据进行处理，使其符合系统的要求，处理完毕后进行XML转换;数据处理模块还负责将实际监控数据与设备指标进行比对，以判断设备工作是否正常。

③XML转换模块。将处理后的数据依照事先制定的XML文档格式进行组织，使其符合XML文档的标准结构，处理完毕的XML数据即可在网络上正常传递。

④通信接口模块。通信接口用于本系统与外界进行通信，同样采用XML形式收发信息，信息可以根据需要进行定义，例如在设备参数发生异常时上报、接收文字消息等。

2.2.3 显示层

显示层用于完成通过Javascript代码按照XML文档内的设置将文档内的数据进行图形渲染，生成最终用户所需的PNG图像［8］。Javascript代码首先读取XML文档的选项部分，对图表初始化，之后依照数据部分的监控数据将图表内的点逐个在图表上描出，再将所有各点连接成曲线，形成最终的图像。

显示层包括用户界面模块和数据显示模块。

①用户界面模块是连接用户与系统的纽带，用于根据用户需求向上层功能模块发出相应的指令，例如查看某一设备状态。

②数据显示模块是本系统的开发重点，负责读取从中间层传递来的XML数据，并以图形的方式将其中的数据显示出来;数据显示模块还负责显示告警信息，以文字形式显示。

本系统采用B/S模式，图形编程在浏览器上通过Javascript来实现。Javascript代码通过操作＜canvas＞对象实现图形渲染，＜canvas＞是一个新的HTML元素，已经在HTML5.0标准中获得确认，主要用于矢量图绘制［9］。该对象可以渲染四边形、扇形和任意的多边形，因此显示层所做的就是将所要呈现的图像分解成以上这3种基本的图形。显示层需要显示3种图形:柱状图、饼图和线图。柱状图可分解为四边形，饼图分解为扇形，而线图实际为多边形，由此实现监控数据的图形化显示［10］。

2.3 系统实现过程

系统工作流程如图3所示。用户通过点击对应的按钮选择需要显示的设备监控数据，显示层的用户界面部分将相应的参数发往综合显示系统。综合显示系统将收到的参数进行处理，形成数据库查询语句，发往数据库。数据库将相应的数据返回给综合显示系统，并对这些数据进行处理。综合显示系统将处理完毕的数据按照事先编写的XML文档格式填写到XML文件中。将XML文件发送到用户计算机，交由浏览器解析。浏览器通过Javascript代码按照文档内的设置将XML文档内的数据进行图形渲染，生成最终用户所需的PNG图像。

图3 系统工作流程

3 系统使用结果分析

图4显示了伺服系统方位角、俯仰角的实际变化情况，以及数据引导方位角、俯仰角的变化情况，可以看到伺服的实际工作情况与引导数据之间仅存在微小差别，说明伺服系统工作正常。

图4 方位角、俯仰角曲线图

由伺服曲线图可知，伺服在开始跟踪和结束跟踪时角度变化缓慢，而在最高仰角时角度变化最为迅速，而仅通过表格形式是很难迅速做出这样的判断的。中放电压是体现接收机工作状态的一项重要指标，图5(a)显示了中放的电压值，图5(b)显示了对应时间中放电压以2 V为基准的电压值。在实战任务中，中放电压存在短时间的突跳，但持续时间很短，不影响系统的正常工作。若持续时间过长，则应对设备进行检修。

图5 中放电压曲线

4 结束语

将设备监控数据以图形的方式通过浏览器显示，利用网络的便利性，使得用户能够在网络内任意节点直观迅速地了解系统内设备的工作状态，具有很强的实用价值，是岗位人员检测设备状态十分有效的手段。同时本系统具有很强的可移植性，应用领域不仅限于VHF系统，其他系统在经过适当改造之后也能够采用。

［1］张兵山.天地超短波通信培训教材［M］.北京:2007:25－37.

［2］陈 曦.基于Ajax构建Web应用程序的研究［J］.古林化工学院学报，2009，24(2):51 －52.

［3］张 琳，张国平.XML数据岛结合AJAX实现Web的异步刷新［J］.电子设计工程，2012，16(20):39 －41.

［4］李为健，卞艺杰.基于DWR和EXT的Ajax应用研究与实现［J］.计算机与现代化，2010，1(4):66 －67.

［5］张 龙，肖琬蓉.集群数据库内容管理系统的设计与实现［J］.情报杂志，2012(2):15－17.

［6］杨振东，何 宏，丁 勇.基于Web的机场油料供应管理系统的设计［J］.计算机应用与软件，2012，29(6):69－71.

［7］JACOBS S.Beginning XML with DOM and Ajax［M］.Berkly Apress，2005:24－40.

［8］杨秀梅，罗显刚，杨秀红.基于WebGIS云南滑坡灾害气象预警分析模型［J］.地理信息世界，2012，8(4):36－40.

［9］FLANAGAN D.JavaScript:The Definitive Guide 5th Edition［M］.Foster O＇Reilly，2006:94 －102.

［10］沈晓星，焦方成，孙 剑.基于VML和AJAX绘制站点的实况曲线图［J］.科技信息，2012(11):72－73.