CN103713874A - 电力系统实时画面Web界面展现方法 - Google Patents

Abstract

本发明公开一种电力系统实时画面web界面展现方法，主要包括：通过后端服务器监控并采集电力设备的状态数据；实时画面发布服务器将该状态数据渲染出一完整界面层；检测到通过终端设备输入实时画面发布服务器网址后，实时画面发布服务器发送界控脚本获取终端的尺寸、分辨率信息，并根据该尺寸及分辨率信息绘制出与终端设备尺寸相同的虚拟画面，并将该虚拟界面发送至终端设备；终端设备接收上述虚拟画面，并采用浏览器内核的画布功能渲染该虚拟画面。本发明可以根据终端设备屏幕尺寸和分辨率信息，输出适合该终端设备画面尺寸的文件。

Description

电力系统实时画面Web界面展现方法

技术领域

本发明涉及一种用于电力系统的实时画面Web界面展现方法。

背景技术

浏览器作为日常办公经常使用的工具，现在也逐渐成为电力调度系统画面调阅的便捷入口。在浏览器上展现电力调度系统厂站图一般使用SVG技术，SVG是一种矢量图描述技术，非常适合用来描述电力系统厂站图中的设备和前景。同时，由于越来越多的浏览器开始支持SVG图的渲染，因此在浏览器上调阅电力系统画面也成为一种必然的选择。移动终端是电力自动化系统应用不断发展的趋势之一，它可使值班室得以扩展延伸，随时随地为用户提供信息，但与PC相比：一是移动终端设备使用触摸操作代替了鼠标操作，屏幕尺寸也不同，传统web界面在移动设备上难以获得良好的用户体验，二是移动终端设备硬件配置较低，当直接加载大SVG图时浏览器出现运行缓慢，甚至崩溃等情况。

因此需要一种新的用于web界面展现的技术方案，能够将web针对不同类型的展现设备，以相适应的形式进行展现，同时不需要对web界面针对不同设备进行重新设计，节省开发成本，并能提供良好的展现画面。

发明内容

本发明的目的是针对现有技术的不足，提供一种电力系统实时画面Web界面展现方法，可以根据终端设备屏幕尺寸和分辨率信息，输出适合该终端设备画面尺寸的文件。

为解决上述技术问题，本发明采用以下技术方案：

电力系统实时画面web界面展现方法，其特征在于，包括：

通过后端服务器监控并采集电力设备的状态数据；

实时画面发布服务器将该状态数据渲染出一完整界面层；

检测到通过终端设备输入实时画面发布服务器网址后，实时画面发布服务器发送界控脚本获取终端的尺寸、分辨率信息，并根据该尺寸及分辨率信息绘制出与终端设备尺寸相同的虚拟画面，并将该虚拟画面发送至终端设备；

终端设备接收上述虚拟画面，并采用浏览器内置SVG技术渲染该虚拟画面。

其中，在终端设备上对画面进行的缩放操作采用两次渲染方式渲染画面，即当终端设备中浏览器界控脚本监听到用户对画面进行缩放操作时，先对上述虚拟画面进行缩放渲染，同时将该操作指令信息发送至实时画面发布服务器，服务器根据缩放区域适配出虚拟画面后返送至终端设备，终端设备再次渲染该虚拟画面。

其中，所述完整界面层包括图元1、图元2、图元3……图元n，将完整界面层对角线长度与终端设备对角线长度的比值确定为每个图元的缩放比例。

其中，所述完整界面层包括图元1、图元2、图元3……图元n，对每个图元分别设置权重，在绘制虚拟画面时，根据权重对图元进行比例缩放。

其中，根据权重对图元缩放后得到的虚拟图元尺寸若小于该图元最小可视尺寸，则放弃该图元的显示。

其中，被放弃的图元可以通过简单图元来代替。

其中，所述虚拟画面以SVG文件格式发送至终端设备。

其中，所述终端设备为触摸屏手机、平板电脑。

与现有技术相比，本发明具有以下有益效果： 

1.根据终端设备屏幕尺寸和分辨率信息，服务器能适配出合适多小的画面文件，从而画面实现更加清晰明了；

2.根据终端设备量身打造的虚拟画面文件在过滤掉不可视图元或区域后字节数变少，传输流量更小；

3.用户在终端设备上缩放操作采用两次渲染的方式渲染虚拟画面，能平滑更新画面，用户体验效果更好；

4.虚拟画面文件以浏览器内置的SVG技术渲染，支持多数移动浏览器或新版本桌面浏览器，从而实现多数终端设备都能显示画面。

附图说明

图1为本发明电力系统实时画面web界面展现方法实施例的流程图。

具体实施方式

为详细说明本发明的技术内容、构造特征、所实现目的及效果，以下结合实施方式并配合附图详予说明。

请参考图1，本发明提供一种电力系统实时画面web界面展现方法一优选实施例的流程图，该方法包括以下步骤：

（S1）通过后端服务器监控并采集电力设备的状态数据，主要包括保护装置、仪表等状态数据；

（S2）实时画面发布服务器将该状态数据渲染出一完整界面层；

（S3）检测到通过终端设备输入实时画面发布服务器网址后，实时画面发布服务器发送界控脚本获取终端的尺寸、分辨率信息，并根据该尺寸及分辨率信息绘制出与终端设备尺寸相同的虚拟画面，并将该虚拟界面发送至终端设备；

（S4）终端设备接收上述虚拟画面，并采用浏览器内核的SVG技术渲染该虚拟画面。

在上述实施例中，在终端设备上对画面进行的缩放操作采用两次渲染方式渲染画面，即当终端设备中浏览器界控脚本监听到用户对画面进行缩放操作时，先对上述虚拟画面进行缩放渲染，同时将该操作指令信息发送至实时画面发布服务器，服务器根据缩放区域适配出虚拟画面后返送至终端设备，终端设备再次渲染该虚拟画面。在这里以放大为例，当在终端设备上执行放大操作后，从而将先前未显示在终端设备上的画面呈现出来。

在上述实施例中，完整界面层可以划分成多个图元，例如图元1、图元2、图元3……图元n，将完整界面层对角线长度与终端设备对角线长度的比值确定为每个图元的缩放比例。

在上述实施例中，在将完整界面层划分成图元1、图元2、图元3……图元n，每个图元都依据上述缩放比例进行缩放后，可能会导致某些图元缩放后小于可视最小尺寸，不能在终端设备上清楚展示，所以作为一优选的实施方式，还可以根据每个图元中数据的重要性，对每个图元分别分别设置相应的权重，在绘制虚拟画面时，根据权重对图元进行比例缩放。比如，上述根据完整界面层对角线长度与终端设备对角线长度的比值确定的缩放比例为S(S>1)，根据图元的重要性，将图元1的权重设为0.8、图元2的权重设为0.6……图元n的权重设置为为0.1，这里越是重要的图元，其权重越高，将图元的权重与缩放比例S相乘，得到图元的最终缩放比例，从而重要的图元数据可以得到清楚呈现。这里只是列举一种权重设置方法，并不限于此。这里图元的权重还可以设成灵活更改的方式，将用户最关心的数据图元的权重设置为最高。

在上述实施例中，根据权重对图元缩放后得到的虚拟图元尺寸若小于该图元最小可视尺寸，则放弃该图元的显示。这里，最小可视尺寸为人眼可分辨的最小画面尺寸，可以根据实际情况灵活设置、调整。

在上述实施例中，被放弃的图元可以通过更简单又能表达其意的图元来代替，这里以电流互感器图元为例，一般一面开关柜3个电流互感器图元，当缩放到不可以见时，采用一个缩写的电流互感器图元代替，缩写的电流互感器图元是在普通的电流互感器图元加上上标3形成的，

在上述实施例中，虚拟画面优选以SVG文件格式发送至终端设备，以节省传输流量。

以上所述，仅为本发明较佳的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到的变化或替换，都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应该以权利要求的保护范围为准。

Claims (8)

1.电力系统实时画面web界面展现方法，其特征在于，包括：

通过后端服务器监控并采集电力设备的状态数据；

实时画面发布服务器将该状态数据渲染出一完整界面层；

检测到通过终端设备输入实时画面发布服务器网址后，实时画面发布服务器发送界控脚本获取终端的尺寸、分辨率信息，并根据该尺寸及分辨率信息绘制出与终端设备尺寸相同的虚拟画面，并将该虚拟界面发送至终端设备；

终端设备接收上述虚拟画面，并采用浏览器内核的画布功能渲染该虚拟画面。

2.根据权利要求1所述的电力系统实时画面web界面展现方法，其特征在于，在终端设备上对画面进行的缩放操作采用两次渲染方式渲染画面，即当终端设备中浏览器界控脚本监听到用户对画面进行缩放操作时，先对上述虚拟画面进行缩放渲染，同时将该操作指令信息发送至实时画面发布服务器，服务器根据缩放区域适配出虚拟画面后返送至终端设备，终端设备再次渲染该虚拟画面。

3.根据权利要求1所述的电力系统实时画面web界面展现方法，其特征在于，所述完整界面层包括图元1、图元2、图元3……图元n，将完整界面层对角线长度与终端设备对角线长度的比值确定为每个图元的缩放比例。

4.根据权利要求1所述的电力系统实时画面web界面展现方法，其特征在于，所述完整界面层包括图元1、图元2、图元3……图元n，对每个图元分别设置权重，在绘制虚拟画面时，根据权重对图元进行比例缩放。

5.根据权利要求4所述的电力系统实时画面web界面展现方法，其特征在于，根据权重对图元缩放后得到的虚拟图元尺寸若小于该图元最小可视尺寸，则放弃该图元的显示。

6.根据权利要求5所所述的电力系统实时画面web界面展现方法，其特征在于，被放弃的图元可以通过简单图元来代替。

7.根据权利要求1所述的电力系统实时画面web界面展现方法，其特征在于，所述虚拟画面以SVG文件格式发送至终端设备。

8.根据权利要求1~7中任一项所述的电力系统实时画面web界面展现方法，其特征在于，所述终端设备为触摸屏手机、平板电脑。