CN111435937A - 一种监控平台的刷新方法及装置 - Google Patents
一种监控平台的刷新方法及装置 Download PDFInfo
- Publication number
- CN111435937A CN111435937A CN201910025371.8A CN201910025371A CN111435937A CN 111435937 A CN111435937 A CN 111435937A CN 201910025371 A CN201910025371 A CN 201910025371A CN 111435937 A CN111435937 A CN 111435937A
- Authority
- CN
- China
- Prior art keywords
- equipment
- data
- picture
- monitored
- monitoring
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
- 238000012544 monitoring process Methods 0.000 title claims abstract description 117
- 238000000034 method Methods 0.000 title claims abstract description 31
- 230000008859 change Effects 0.000 claims description 38
- 230000004044 response Effects 0.000 claims description 8
- 230000000007 visual effect Effects 0.000 claims description 2
- 238000009877 rendering Methods 0.000 abstract description 12
- 238000013461 design Methods 0.000 abstract description 10
- 238000010586 diagram Methods 0.000 description 11
- 238000012545 processing Methods 0.000 description 9
- 238000011161 development Methods 0.000 description 7
- 230000006870 function Effects 0.000 description 6
- 230000005540 biological transmission Effects 0.000 description 5
- 238000004590 computer program Methods 0.000 description 5
- 238000005516 engineering process Methods 0.000 description 5
- 238000012986 modification Methods 0.000 description 5
- 230000004048 modification Effects 0.000 description 5
- 230000008569 process Effects 0.000 description 5
- 238000013515 script Methods 0.000 description 4
- 238000004891 communication Methods 0.000 description 2
- 230000004075 alteration Effects 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000000052 comparative effect Effects 0.000 description 1
- 230000003111 delayed effect Effects 0.000 description 1
- 230000008676 import Effects 0.000 description 1
- 230000010354 integration Effects 0.000 description 1
- 238000012423 maintenance Methods 0.000 description 1
- 238000004519 manufacturing process Methods 0.000 description 1
- 238000012806 monitoring device Methods 0.000 description 1
- 239000007787 solid Substances 0.000 description 1
- 238000012546 transfer Methods 0.000 description 1
Images
Classifications
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
- H04L67/00—Network arrangements or protocols for supporting network services or applications
- H04L67/01—Protocols
- H04L67/02—Protocols based on web technology, e.g. hypertext transfer protocol [HTTP]
- H04L67/025—Protocols based on web technology, e.g. hypertext transfer protocol [HTTP] for remote control or remote monitoring of applications
-
- H—ELECTRICITY
- H04—ELECTRIC COMMUNICATION TECHNIQUE
- H04L—TRANSMISSION OF DIGITAL INFORMATION, e.g. TELEGRAPHIC COMMUNICATION
- H04L67/00—Network arrangements or protocols for supporting network services or applications
- H04L67/14—Session management
- H04L67/141—Setup of application sessions
Landscapes
- Engineering & Computer Science (AREA)
- Computer Networks & Wireless Communication (AREA)
- Signal Processing (AREA)
- Digital Computer Display Output (AREA)
Abstract
本发明公开了一种监控平台的刷新方法及装置,该方法包括:获取第一监控数据,第一监控数据包括第一监控设备的设备标识和第一数据,根据设备标识,确定与设备标识对应的画面显示层,根据第一数据更新与设备标识对应的画面显示层的显示画面。该技术方案不是对整个Web页面进行刷新,而是将整个Web页面划分为多个画面显示层,根据设备状态发生变化的被监控设备的标识确定待刷新画面显示层,从而实现只对待刷新画面显示层进行刷新。对综合监控平台的Web页面进行画面分层管理,从而可以将运行态画面进行分层设计,降低不必要的渲染性能开销,提高刷新速度。
Description
技术领域
本发明实施例涉及综合监控系统组态平台领域,尤其涉及一种监控平台的刷新方法及装置。
背景技术
面对综合监控平台系统的发展需求,基于Web(World Wide Web,万维网)的综合监控系统是今后发展的一个重要方向。新一代的综合监控系统主要采用JAVA、HTML(HyperText Markup Language,超文本标记语言)、JavaScript、Internet、面向对象等技术,从而扩大综合监控系统与其他系统的集成和综合安全经济运行以及商业化运营的需要,不仅提高了综合监控系统的适应范围,提高了系统的可靠性,也使综合监控系统的管理和维护变得更加简单方便。基于Web的综合监控系统符合综合监控系统的发展潮流,利用Web服务器端编程技术和图形处理技术结合浏览器客户端技术,设计开发一套基于Web的综合监控系统,该系统能适应多种服务器和客户端平台,便于维护管理,安全可靠,并且不受地理位置限制。
国内现有的基于Web的综合监控系统,在画面刷新方面,还存在一些问题,当监控对象达到一定数量以上时,他们使用的传统的SVG(Scalable Vector Graphics,可缩放矢量图形)刷新方式会占用较多地CPU(Central Processing Unit,中央处理器)和内存资源,画面会出现卡顿,操作会相应延迟。综合监控系统大部分是实时显示,通过画面图形的显示,实时展示监控设备的状态,若在Web页面显示刷新画面图形时需要很长的时间,必定会影响综合监控系统的效率和设备监控结果的实时性。
发明内容
本发明实施例提供一种监控平台的刷新方法及装置,从而达到高效的刷新Web页面的显示画面。
本发明实施例提供的一种监控平台的刷新方法,包括:
获取第一监控数据;所述第一监控数据是服务器在被监控设备的设备状态发生变化后确定的数据;所述第一监控数据包括第一监控设备的设备标识和第一数据,所述第一监控设备是设备状态发生变化的被监控设备;所述第一数据是所述第一监控设备的设备状态发生变化后的数据;
根据所述设备标识,确定与所述设备标识对应的画面显示层;其中,不同的画面显示层对应的被监控设备的设备状态变化频率不同;
根据所述第一数据更新与所述设备标识对应的画面显示层的显示画面。
上述技术方案中,获取到第一监控数据,根据第一监控数据中的设备标识确定待刷新的画面显示层,再根据第一监控数据中的第一数据对待刷新的画面显示层进行刷新,也就是说,该技术方案不是对整个Web页面进行刷新,而是将整个Web页面划分为多个画面显示层,根据设备状态发生变化的被监控设备的标识确定待刷新画面显示层,从而实现只对待刷新画面显示层进行刷新。对综合监控平台的Web页面进行画面分层管理,从而可以将运行态画面进行分层设计,降低不必要的渲染性能开销,提高刷新速度。
可选的,在所述获取第一监控数据之前,还包括:
在接收到启动指令后,向所述服务器发送建立连接的请求;
获取所述服务器的响应信息建立连接。
可选的,所述向所述服务器发送建立连接的请求,包括:
向所述服务器发送建立长连接的请求。
上述技术方案中,在Web页面启动时,向服务器发送建立连接的请求,并获取服务器的响应信息建立连接,即提前将客户端与服务器之间的连接建立起来,在服务器发现被监控设备的设备状态发生变化时,实时将被监控设备的设备状态发生变化后的数据发送给客户端,也就是说,Web页面在启动时,只需要客户端与服务器建立一次连接,而不是每次服务器向客户端发送数据时都要建立连接,这样,节省了建立连接所需的时间,进一步提高刷新速度。
可选的,在所述获取第一监控数据之前,还包括:
获取各被监控设备的设备状态变化频率和画面配置信息;
根据所述被监控设备的设备状态变化频率,创建多个画面显示层;
根据各画面显示层对应的被监控设备的画面配置信息,为各画面显示层绘制显示画面;
将绘制的各画面显示层的显示画面进行显示。
上述技术方案中,根据各被监控设备的设备状态变化频率,创建多个画面显示层,每个画面显示层中对应的被监控设备的设备状态变化频率相近,所以,多个被监控设备的设备状态发生变化时,待刷新的画面显示层的个数尽可能少,从而降低不必要的渲染性能开销,提高刷新速度。
可选的,所述根据所述被监控设备的设备状态变化频率,创建多个画面显示层,包括:
根据预设频率阈值对所述被监控设备进行分类;
创建与每个分类对应的画面显示层;
根据每个分类中的被监控设备的设备标识,建立每个画面显示层与所述每个分类中的被监控设备的设备标识的对应关系。
上述技术方案中,根据预设频率阈值对被监控设备分类,每个被监控设备类别都对应一个画面显示层,以及每个画面显示层都对应被监控设备的设备标识,在接收到服务器的第一监控数据后,可以确定出待更新的画面显示层,提高画面刷新速度。
相应的,本发明实施例还提供了一种监控平台的刷新装置,包括:
获取单元,用于获取第一监控数据;所述第一监控数据是服务器在被监控设备的设备状态发生变化后确定的数据;所述第一监控数据包括第一监控设备的设备标识和第一数据,所述第一监控设备是设备状态发生变化的被监控设备;所述第一数据是所述第一监控设备的设备状态发生变化后的数据;
确定单元,用于根据所述设备标识,确定与所述设备标识对应的画面显示层;其中,不同的画面显示层对应的被监控设备的设备状态变化频率不同;
显示单元,用于根据所述第一数据更新与所述设备标识对应的画面显示层的显示画面。
可选的,所述获取单元还用于:
在所述获取第一监控数据之前,接收到启动指令后,向所述服务器发送建立连接的请求;
获取所述服务器的响应信息建立连接。
可选的,所述获取单元具体用于:
向所述服务器发送建立长连接的请求。
可选的,所述获取单元还用于:
在所述获取第一监控数据之前,获取各被监控设备的设备状态变化频率和画面配置信息;
根据所述被监控设备的设备状态变化频率,创建多个画面显示层;
根据各画面显示层对应的被监控设备的画面配置信息,为各画面显示层绘制显示画面;
将绘制的各画面显示层的显示画面进行显示。
可选的,所述获取单元还用于:
根据预设频率阈值对所述被监控设备进行分类;
创建与每个分类对应的画面显示层;
根据每个分类中的被监控设备的设备标识,建立每个画面显示层与所述每个分类中的被监控设备的设备标识的对应关系。
相应的,本发明实施例还提供了一种计算设备,包括:
存储器,用于存储程序指令;
处理器,用于调用所述存储器中存储的程序指令,按照获得的程序执行上述监控平台的刷新方法。
相应的,本发明实施例还提供了一种计算机可读非易失性存储介质,包括计算机可读指令,当计算机读取并执行所述计算机可读指令时,使得计算机执行上述监控平台的刷新方法。
附图说明
为了更清楚地说明本发明实施例中的技术方案,下面将对实施例描述中所需要使用的附图作简要介绍,显而易见地,下面描述中的附图仅仅是本发明的一些实施例,对于本领域的普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他的附图。
图1为本发明实施例提供的一种系统架构的示意图;
图2为本发明实施例提供的一种监控平台的刷新方法的流程示意图;
图3为本发明实施例提供的多个Canvas标签实现分层的示意图;
图4为本发明实施例提供的一种具体场景下的监控平台显示画面的示意图;
图5为本发明实施例提供的一种绘制初始化的各显示画面的流程示意图;
图6为本发明实施例提供的SVG和Canvas标签的刷新时间对比趋势图;
图7为本发明实施例提供的另一种监控平台的刷新方法的流程示意图;
图8为本发明实施例提供的一种监控平台的刷新装置的结构示意图。
具体实施方式
为了使本发明的目的、技术方案和优点更加清楚,下面将结合附图对本发明作进一步地详细描述,显然,所描述的实施例仅仅是本发明一部分实施例,而不是全部的实施例。基于本发明中的实施例,本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其它实施例,都属于本发明保护的范围。
图1示例性的示出了本发明实施例提供监控平台的刷新方法所适用的系统架构,该系统架构可以为基于WebGL(Web Graphics Library,web图形库)的高效画面刷新综合监控平台,具体可以包括开发平台100、客户端200、Web服务器300、数据接入层400和数据源模块500。
开发平台100:开发平台100包括设计资源管理模块、业务代码生成模块、数据服务管理模块及用户权限管理模块。开发平台100主要是根据客户需求,搭建综合监控系统,同时用于管理客户端200设计保存的各种图形文件,根据客户端200的设计配置规则,采用WebSocket技术,接收数据接入层400向前推送的实时变化数据,展示综合监控画面。
客户端200:客户端主要包括页面编辑器、画面编辑器、脚本编辑器和报表编辑器等各项在线组态编辑器。用户通过在线编辑器设计配置画面、脚本、报表及页面,然后保存文件到开发平台100。其中,在画面编辑器中,采用HTML5的Canvas标签,并且在设计绘制图形时,可通过更改图形所处的画布层数,完成画布分层功能,实现画面高效刷新。
Web服务器300:Web服务器300包括数据服务模块、用户权限模块、输入校验模块、导入导出模块、异常处理模块和日志服务模块。所提供的在线数据服务的设计功能,通用数据的增、删、改、查操作不需要再分别编写Java代码,而是通过在线设计的方式实现。用户权限模块是对综合监控平台的安全处理措施,用户只能访问操作自己拥有权限的功能模块,而不能对自己权限外的功能模块进行访问或操作。异常处理模块和日志服务模块用于处理记录综合监控平台的运行信息。
数据接入层400:数据接入层400包括数据接入模块、数据处理模块和数据缓存模块。数据接入模块通过统一接口,从数据源模块500获取数据,后经数据处理模块对获取的数据进行处理,然后储存到数据缓存模块,供后面应用程序使用。
基于上述描述,图2示例性的示出了本发明实施例提供的一种监控平台的刷新方法的流程,该流程可以由监控平台的刷新装置执行,该装置可以位于客户端中,可以是该客户端。如图2所示,该流程具体包括:
步骤201,获取第一监控数据。
其中,第一监控数据是服务器在被监控设备的设备状态发生变化后确定的数据。第一监控数据包括第一监控设备的设备标识和第一数据,第一监控设备是设备状态发生变化的被监控设备;第一数据是第一监控设备的设备状态发生变化后的数据;
在具体实施例中,服务器可以实时获取被监控设备的状态数据,并根据被监控设备的状态数据判断出设备状态发生变化的被监控设备,以及对应的发生变化后的设备状态数据,进一步的,将设备状态发生变化的被监控设备以及对应的发生变化后的设备状态打包为第一监控数据,发送至客户端。
步骤202,根据所述设备标识,确定与所述设备标识对应的画面显示层。
其中,不同的画面显示层对应的被监控设备的设备状态变化频率不同,根据设备状态发生变化的被监控设备的标识,确定该设备状态发生变化的被监控设备所在的画面显示层,也就是确定的本次待刷新的画面显示层。
需要说明的是,画面显示层是在步骤201之前已经确定的,具体的,各画面显示层对应的被监控设备、以及被监控设备的配置信息等,都在步骤201之前确定。
作为本发明的一种实现方式,可以获取各被监控设备的设备状态变化频率和画面配置信息,根据被监控设备的设备状态变化频率,创建多个画面显示层,根据各画面显示层对应的被监控设备的画面配置信息,为各画面显示层绘制显示画面。上述绘制出各画面显示层的显示画面之后,可以将该绘制的各画面显示层的显示画面进行显示。
示例性的,可以通过添加多个Canvas标签实现多个画面显示层,可以生成多个Canvas实例,把多个Canvas实例重叠放置,每个Canvas使用不同的z-index来定义堆叠的次序,具体可以如图3示出,该显示画面包括三个画面显示层,Layer1、Layer2、Layer3。分别设置三个画面显示层的z-index由高到低,则可以确定出layer1设置在最顶层,Layer3设置在最底层。
在根据被监控设备的设备状态变化频率,创建多个画面显示层时,可以根据预设频率阈值对被监控设备进行分类,创建与每个分类对应的画面显示层;根据每个分类中的被监控设备的设备标识,建立每个画面显示层与每个分类中的被监控设备的设备标识的对应关系。
示例性的,在某个具体场景中存在20台被监控设备,分别确定每个被监控设备的设备状态的变化频率,并根据各被监控设备的设备状态的变化频率进行划分,将同一类被监控设备设置于一个画面显示层中。假设,可以将该20台被监控设备划分为4类,每类5台,假设如表1所示。
此处,同一类的被监控设备的设备状态的变化频率可以相同,例如,A类被监控设备的设备状态的变化频率为10次/分钟,B类被监控设备的设备状态的变化频率为12次/分钟。当然,也可以处于一定的变化频率区间内,例如,A类被监控设备的设备状态的变化频率为(10次/分钟~20次/分钟),B类被监控设备的设备状态的变化频率为(20次/分钟~30次/分钟)等。
表1
被监控设备分类 | 每类对应的被监控设备的设备标识 |
A类 | A<sub>1</sub>、A<sub>2</sub>、A<sub>3</sub>、A<sub>4</sub>、A<sub>5</sub> |
B类 | B<sub>1</sub>、B<sub>2</sub>、B<sub>3</sub>、B<sub>4</sub>、B<sub>5</sub> |
C类 | C<sub>1</sub>、C<sub>2</sub>、C<sub>3</sub>、C<sub>4</sub>、C<sub>5</sub> |
D类 | D<sub>1</sub>、D<sub>2</sub>、D<sub>3</sub>、D<sub>4</sub>、D<sub>5</sub> |
用于监控该20台被监控设备的监控平台的显示画面可以划分为4个画面显示层,设置该四个画面显示层分别用于显示A类被监控设备、B类被监控设备、C类被监控设备、D类被监控设备,具体的,将A类被监控设备A1、A2、A3、A4、A5绘制在第一画面显示层,B类被监控设备B1、B2、B3、B4、B5绘制在第二画面显示层,C类被监控设备C1、C2、C3、C4、C5绘制在第三画面显示层,D类被监控设备D1、D2、D3、D4、D5绘制在第四画面显示层。
将A、B、C、D四类被监控设备对应的各画面显示层绘制在显示画面,即可以如图4所示,其中,A类设备用实心原点表示;B类设备用空心原点表示;C类设备用实心三角形表示;D类设备用空心三角形表示。
步骤203,根据所述第一数据更新与所述设备标识对应的画面显示层的显示画面。
在确定出本次待刷新的画面显示层之后,可以根据被监控设备的设备状态发生变化后的数据对本次待刷新的画面显示层进行刷新显示。
结合表1、图4,根据设备标识,确定与设备标识对应的画面显示层,并根据第一数据更新与设备标识对应的画面显示层的显示画面,即可以举例如下:
服务器发送第一监控数据,其中,第一监控数据中的设备标识和第一数据可以如表2所示。
表2
设备标识 | 第一数据 |
B<sub>2</sub> | 状态1 |
B<sub>3</sub> | 状态2 |
C<sub>1</sub> | 状态3 |
C<sub>2</sub> | 状态4 |
C<sub>4</sub> | 状态5 |
由表1可知,被监控设备B2、B3位于B类,设置在第二画面显示层中;被监控设备C1、C2、C4位于C类,设置在第三画面显示层中,所以客户端可以至更新图4中的第二画面显示层和第三画面显示层,相应的,第一画面显示层、第四画面显示层不刷新。减少了客户端的Web页面不必要的图形渲染和画面刷新,从而进一步提高画面刷新速度。
如图5示出了本发明实施例提供的一种绘制初始化的显示画面的具体例子。
步骤501,使用绘图工具绘制基本图元,将绘制好并配置好信息的基本图元提交到开发平台,并加入到图元库中。
在绘制基本图元时,可以采用HTML5的Canvas标签。其中,Canvas是HTML5的画布元素,允许用户使用JavaScript来绘制2D图形,遵守W3C(World Wide Web Consortium,万维网联盟)标准。JavaScript调用DOM((Document Object Model,文档对象模型)API(Application Programming Interface,应用程序编程接口)进行绘图渲染,其中,DOM API包括Canvas API,该绘图技术相比其他绘图技术,例如SVG绘图技术,可实现图形的高速渲染,从而实现画面高效刷新。基本图元文件承载图形及图像信息,并且承载其他附加的设置信息,将绘制好并配置好信息的基本图元提交到开发平台,并加入到图元库中。
此处,画布相当于在客户端的显示界面上的画面显示层。
步骤502,使用绘图工具绘制画面图形,对画布及绘制的图形进行定义和信息设置,实现画布分层和图形渲染。
画面编辑器中的图元库展示图元库中的所有基本图元,使用绘图工具绘制画面图形,采用HTML5的Canvas标签,同时可以对画布及绘制的图形进行定义和信息设置,成功实现画布分层和图形渲染。
其中,在通过添加多个Canvas标签实现分层时,可以生成多个Canvas实例,把多个Canvas实例重叠放置,每个Canvas使用不同的z-index来定义堆叠的次序,然后在需要绘制该层的时候进行重绘。把不同的被监控设备的画面图形分别放在不同的画面显示层中,这不仅实现了视觉上的上下覆盖,更重要的是当图形元素发生变化后的画面刷新仅仅局限在发生了变化的画面显示层中,能够大大降低完全不必要的渲染性能开销,进一步增加了画面的刷新速度。
可选的,在步骤502中,使用绘图工具绘制画面图形,对画布及绘制的图形进行定义和信息设置,实现画布分层和图形渲染,具体实施例可以如下。
(1)用户绘制基本图形或直接导入图元库中的基本图元,对画面图形进行信息设置。信息设置可以包括设置画面图形前后位置、缩放画面图形、拖动画面图形、旋转画面图形、设置图形线条或填充等信息。
(2)通过设置画面图形所处的画布信息,实现画布分层,用户还可对画布上的画面图形进行编辑,例如,对画布上的画面图形进行选择、剪切、复制、粘贴、删除、设置图形位置等操作。
(3)分别将各画布上的画面图形关联被监控设备,同时编辑动画脚本信息,保存画面图形的文件,包括提供监控的所有配置信息及画面图形,将保存的配置信息同步到画面图形以供展示监控画面时使用。
在绘制完成初始化的各显示画面之后,可以将绘制的各画面显示层的显示画面进行显示。进一步的,当Web页面启动时,客户端可以实时获取服务器的关于被监控设备的设备状态数据,并根据绘制的各画面显示层的初始化的显示画面、各画面显示层的配置信息等进行显示。
当然在步骤502之后,还可以有以下实现步骤。
步骤503,数据接入层通过设置接口接入数据源模块的实时数据,从数据源模块中获取被监控设备的测点数据,传输到开发平台。
步骤504,通过浏览器打开画面文件,读取客户端保存的画面文件及配置信息,并根据配置信息、配置规则获取数据接入层传输的各个被监控设备的监控点的测点数据,按照规则进行实时的展现和画面高效刷新。
上述实施例中,采用HTML5的Canvas标签,将显示画面进行分层设计,Canvas与SVG之间具有如下区别:
(1)SVG支持事件处理器,而Canvas不支持事件处理器,也就是说SVG是可以控制元素的DOM对象来处理事件的,即SVG可以单独处理每个子元素的事件,Canvas只能处理整个画布的事件。对于SVG来说,如果用DOM比较频繁就会有性能方面的问题。
(2)Canvas是单个HTML元素,Canvas是通过JavaScript脚本来获取Canvas画图对象然后调用对象属性、方法实现绘制图形的。而SVG则是使用XML(Extensible MarkupLanguage,可扩展标记语言)描述2D图形的,然后通过JavaScript、CSS(Cascading StyleSheets,层叠样式表)属性来修改的,SVG是通过HTML元素设置属性来实现绘制图形的。
所以Canvas所需刷新时间更少,并降低了计算机的CPU和内存占用率。当被监控设备达到一定数量以上时,使用SVG时,画面刷新出现卡顿的情况,而采用HTML5的Canvas标签,画面刷新无明显卡顿。具体刷新时间还会受到硬件条件等其他因素的影响,在相同环境下,通过对比SVG和HTML5的Canvas标签,得到SVG和Canvas标签的刷新时间对比趋势图,如图6所示。
为了更高效的刷新Web页面的显示画面,本发明实施例还提供一种优选的方式:
在获取第一监控数据之前,客户端与服务器先建立起实时通讯的连接,即客户端与服务器在一个会话中一直保持连接,若服务器接收到被监控设备的设备状态有变化的数据,则直接把变化的数据传输到客户端,客户端根据变化的数据进行显示,真正做到实时传输数据。具体的,客户端在接收到启动指令后,可以向服务器发送建立连接的请求,并获取服务器的响应信息建立连接。
可选的,客户端向服务器发送的建立连接的请求可以为建立长连接的请求。
本发明提供一种客户端与服务器建立连接的具体的实施例。
客户端中用于显示监控画面的Web页面在启动时,Web页面可以通过JavaScript向服务器发出建立WebSocket连接的请求。其中,WebSocket连接只需要一次HTTP(HyperTextTransfer Protocol,超文本传送协议)握手,服务器就能一直与客户端保持通信,直到关闭连接,解决了服务器需要反复解析HTTP协议,减少了资源的开销,提高了数据传输的速度。服务器接收被监控设备的设备状态数据,一旦被监控设备的设备状态发生变化,服务器就会将第一监控数据发送至客户端,客户端根据第一监控数据进行Web页面的显示。该技术方案中,通过WebSocket连接技术,实现了服务器将被监控设备的变化数据实时推送到客户端,客户端实时进行显示。
为了更好的解释本发明实施例,还可以结合如图4示出的显示画面,对该显示画面实现如图7的画面刷新流程,该流程包括以下步骤。
步骤701,发送建立连接的请求。
客户端中用于显示监控画面的Web页面启动时,Web页面通过JavaScript向服务器发送用于建立WebSocket连接的请求。
步骤702,服务器把当前设备状态数据发送给客户端。
步骤703,显示界面进行初步显示。
客户端的显示界面根据各画面显示层的配置信息以及接收到的设备状态数据进行初步显示。
步骤704,发送第一监控数据。
服务器接收被监控设备的设备状态数据,并根据设备状态数据确定出第一监控数据,其中,第一监控数据包括设备状态发生变化的被监控设备的标识、设备状态发生变化的被监控设备的设备状态发生变化后的数据。
步骤705,确定待刷新的画面显示层。
客户端根据接收到的第一监控数据后,根据设备状态发生变化的被监控设备的标识,确定待刷新的画面显示层。
步骤706,刷新待刷新的画面显示层。
客户端根据接收到的第一监控数据后,根据被监控设备的设备状态发生变化后的数据,对待刷新的画面显示层进行刷新。
上述实施例中,获取到第一监控数据,根据第一监控数据中的设备标识确定待刷新的画面显示层,再根据第一监控数据中的第一数据对待刷新的画面显示层进行刷新,也就是说,该技术方案不是对整个Web页面进行刷新,而是将整个Web页面划分为多个画面显示层,根据设备状态发生变化的被监控设备的标识确定待刷新画面显示层,从而实现只对待刷新画面显示层进行刷新。对综合监控平台的Web页面进行画面分层管理,从而可以将运行态画面进行分层设计,降低不必要的渲染性能开销,提高刷新速度。此外,在Web页面启动时,客户端向服务器发送建立连接的请求,并获取服务器的响应信息建立连接,即提前将客户端与服务器之间的连接建立起来,在服务器发现被监控设备的设备状态发生变化时,实时将被监控设备的设备状态发生变化后的数据发送给客户端,也就是说,Web页面在启动时,只需要客户端与服务器建立一次连接,而不是每次服务器向客户端发送数据时都要建立连接,这样,节省了建立连接所需的时间,进一步提高刷新速度。
本发明实施例具有以下有益效果:
第一,采用WebSocket连接方式进行数据传输,数据传输通道为长连接,大大减少了数据传输所需的时间,从而可及时把被监控设备的实时变化数据传输到客户端,以使得客户端达到实时显示。
第二,采用Canvas标签,在客户端的Web页面上提高了画面刷新的速度,由于Canvas标签具有高效的渲染和刷新效率,且Canvas标签的低内存和低CPU占用率,可以展示更多地监控对象。
第三,提出的分层设计,进一步降低了综合监控画面的渲染性能开销,大大降低了画面刷新所需的时间,从而提高了前端画面刷新的实时性。
基于同一发明构思,图8示例性的示出了本发明实施例提供的一种监控平台的刷新装置的结构,该装置可以执行监控平台的刷新方法的流程。
该监控平台的刷新装置,包括:
获取单元801,用于获取第一监控数据;所述第一监控数据是服务器在被监控设备的设备状态发生变化后确定的数据;所述第一监控数据包括第一监控设备的设备标识和第一数据,所述第一监控设备是设备状态发生变化的被监控设备;所述第一数据是所述第一监控设备的设备状态发生变化后的数据;
确定单元802,用于根据所述设备标识,确定与所述设备标识对应的画面显示层;其中,不同的画面显示层对应的被监控设备的设备状态变化频率不同;
显示单元803,根据所述第一数据更新与所述设备标识对应的画面显示层的显示画面。
可选的,所述获取单元801还用于:
在所述获取第一监控数据之前,接收到启动指令后,向所述服务器发送建立连接的请求;
获取所述服务器的响应信息建立连接。
可选的,所述获取单元801具体用于:
向所述服务器发送建立长连接的请求。
可选的,所述获取单元801还用于:
在所述获取第一监控数据之前,获取各被监控设备的设备状态变化频率和画面配置信息;
根据所述被监控设备的设备状态变化频率,创建多个画面显示层;
根据各画面显示层对应的被监控设备的画面配置信息,为各画面显示层绘制显示画面;
将绘制的各画面显示层的显示画面进行显示。
所述获取单元801还用于:
根据预设频率阈值对所述被监控设备进行分类;
创建与每个分类对应的画面显示层;
根据每个分类中的被监控设备的设备标识,建立每个画面显示层与所述每个分类中的被监控设备的设备标识的对应关系。
基于同一发明构思,本发明实施例还提供了一种计算设备,包括:
存储器,用于存储程序指令;
处理器,用于调用所述存储器中存储的程序指令,按照获得的程序执行上述监控平台的刷新方法。
基于同一发明构思,本发明实施例还提供了一种计算机可读非易失性存储介质,包括计算机可读指令,当计算机读取并执行所述计算机可读指令时,使得计算机执行上述监控平台的刷新方法。
本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器,使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中,使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品,该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上,使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理,从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
尽管已描述了本发明的优选实施例,但本领域内的技术人员一旦得知了基本创造性概念,则可对这些实施例作出另外的变更和修改。所以,所附权利要求意欲解释为包括优选实施例以及落入本发明范围的所有变更和修改。
显然,本领域的技术人员可以对本发明进行各种改动和变型而不脱离本发明的精神和范围。这样,倘若本发明的这些修改和变型属于本发明权利要求及其等同技术的范围之内,则本发明也意图包含这些改动和变型在内。
Claims (10)
1.一种监控平台的刷新方法,其特征在于,包括:
获取第一监控数据;所述第一监控数据是服务器在被监控设备的设备状态发生变化后确定的数据;所述第一监控数据包括第一监控设备的设备标识和第一数据,所述第一监控设备是设备状态发生变化的被监控设备;所述第一数据是所述第一监控设备的设备状态发生变化后的数据;
根据所述设备标识,确定与所述设备标识对应的画面显示层;其中,不同的画面显示层对应的被监控设备的设备状态变化频率不同;
根据所述第一数据更新与所述设备标识对应的画面显示层的显示画面。
2.如权利要求1所述的方法,其特征在于,在所述获取第一监控数据之前,还包括:
在接收到启动指令后,向所述服务器发送建立连接的请求;
获取所述服务器的响应信息建立连接。
3.如权利要求2所述的方法,其特征在于,所述向所述服务器发送建立连接的请求,包括:
向所述服务器发送建立长连接的请求。
4.如权利要求1所述的方法,其特征在于,在所述获取第一监控数据之前,还包括:
获取各被监控设备的设备状态变化频率和画面配置信息;
根据所述被监控设备的设备状态变化频率,创建多个画面显示层;
根据各画面显示层对应的被监控设备的画面配置信息,为各画面显示层绘制显示画面;
将绘制的各画面显示层的显示画面进行显示。
5.如权利要求4所述的方法,其特征在于,所述根据所述被监控设备的设备状态变化频率,创建多个画面显示层,包括:
根据预设频率阈值对所述被监控设备进行分类;
创建与每个分类对应的画面显示层;
根据每个分类中的被监控设备的设备标识,建立每个画面显示层与所述每个分类中的被监控设备的设备标识的对应关系。
6.一种监控平台的刷新装置,其特征在于,包括:
获取单元,用于获取第一监控数据;所述第一监控数据是服务器在被监控设备的设备状态发生变化后确定的数据;所述第一监控数据包括第一监控设备的设备标识和第一数据,所述第一监控设备是设备状态发生变化的被监控设备;所述第一数据是所述第一监控设备的设备状态发生变化后的数据;
确定单元,用于根据所述设备标识,确定与所述设备标识对应的画面显示层;其中,不同的画面显示层对应的被监控设备的设备状态变化频率不同;
显示单元,用于根据所述第一数据更新与所述设备标识对应的画面显示层的显示画面。
7.如权利要求6所述的装置,其特征在于,所述获取单元还用于:
在所述获取第一监控数据之前,接收到启动指令后,向所述服务器发送建立连接的请求;
获取所述服务器的响应信息建立连接。
8.如权利要求7所述的装置,其特征在于,所述获取单元具体用于:
向所述服务器发送建立长连接的请求。
9.如权利要求6所述的装置,其特征在于,所述获取单元还用于:
在所述获取第一监控数据之前,获取各被监控设备的设备状态变化频率和画面配置信息;
根据所述被监控设备的设备状态变化频率,创建多个画面显示层;
根据各画面显示层对应的被监控设备的画面配置信息,为各画面显示层绘制显示画面;
将绘制的各画面显示层的显示画面进行显示。
10.如权利要求9所述的装置,其特征在于,所述获取单元还用于:
根据预设频率阈值对所述被监控设备进行分类;
创建与每个分类对应的画面显示层;
根据每个分类中的被监控设备的设备标识,建立每个画面显示层与所述每个分类中的被监控设备的设备标识的对应关系。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910025371.8A CN111435937A (zh) | 2019-01-11 | 2019-01-11 | 一种监控平台的刷新方法及装置 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910025371.8A CN111435937A (zh) | 2019-01-11 | 2019-01-11 | 一种监控平台的刷新方法及装置 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN111435937A true CN111435937A (zh) | 2020-07-21 |
Family
ID=71580225
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201910025371.8A Pending CN111435937A (zh) | 2019-01-11 | 2019-01-11 | 一种监控平台的刷新方法及装置 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN111435937A (zh) |
Cited By (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111947680A (zh) * | 2020-09-22 | 2020-11-17 | 北京百度网讯科技有限公司 | 用于展示数据的方法、装置、设备以及存储介质 |
CN113329054A (zh) * | 2021-04-27 | 2021-08-31 | 杭州壹悟科技有限公司 | 一种设备监控动画显示优化方法及装置 |
CN113656729A (zh) * | 2021-07-23 | 2021-11-16 | 广州鲁邦通物联网科技有限公司 | 一种基于xml规则自动生成设备的web数据曲线的方法和系统 |
CN113741380A (zh) * | 2021-11-08 | 2021-12-03 | 西安热工研究院有限公司 | Dcs监视画面刷新方法、系统、设备及可读存储介质 |
Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN102323806A (zh) * | 2011-07-08 | 2012-01-18 | 中冶南方(武汉)自动化有限公司 | 一种变频器监控平台及其监控方法 |
JP2012203633A (ja) * | 2011-03-25 | 2012-10-22 | Toshiba Corp | 画面制御プログラム及び情報処理装置 |
US20150127716A1 (en) * | 2013-11-04 | 2015-05-07 | Vmware, Inc. | Filtering Unnecessary Display Updates for a Networked Client |
US9495652B1 (en) * | 2003-06-23 | 2016-11-15 | Daniel M. Cook | Autonomic discrete business activity management method |
CN106919358A (zh) * | 2017-03-10 | 2017-07-04 | 广东欧珀移动通信有限公司 | 一种移动终端的显示控制方法、装置及移动终端 |
CN108459941A (zh) * | 2018-03-09 | 2018-08-28 | 深圳达实智能股份有限公司 | 一种分布式数据采集及软件监控的方法及系统 |
US20180270290A1 (en) * | 2017-03-15 | 2018-09-20 | Commvault Systems, Inc. | Remote commands framework to control clients |
CN108665520A (zh) * | 2018-04-24 | 2018-10-16 | 微梦创科网络科技(中国)有限公司 | 一种页面动画渲染的方法及装置 |
CN108710544A (zh) * | 2018-03-20 | 2018-10-26 | 青岛海信网络科技股份有限公司 | 一种数据库系统的进程监控方法及轨道交通综合监控系统 |
-
2019
- 2019-01-11 CN CN201910025371.8A patent/CN111435937A/zh active Pending
Patent Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US9495652B1 (en) * | 2003-06-23 | 2016-11-15 | Daniel M. Cook | Autonomic discrete business activity management method |
JP2012203633A (ja) * | 2011-03-25 | 2012-10-22 | Toshiba Corp | 画面制御プログラム及び情報処理装置 |
CN102323806A (zh) * | 2011-07-08 | 2012-01-18 | 中冶南方(武汉)自动化有限公司 | 一种变频器监控平台及其监控方法 |
US20150127716A1 (en) * | 2013-11-04 | 2015-05-07 | Vmware, Inc. | Filtering Unnecessary Display Updates for a Networked Client |
CN106919358A (zh) * | 2017-03-10 | 2017-07-04 | 广东欧珀移动通信有限公司 | 一种移动终端的显示控制方法、装置及移动终端 |
US20180270290A1 (en) * | 2017-03-15 | 2018-09-20 | Commvault Systems, Inc. | Remote commands framework to control clients |
CN108459941A (zh) * | 2018-03-09 | 2018-08-28 | 深圳达实智能股份有限公司 | 一种分布式数据采集及软件监控的方法及系统 |
CN108710544A (zh) * | 2018-03-20 | 2018-10-26 | 青岛海信网络科技股份有限公司 | 一种数据库系统的进程监控方法及轨道交通综合监控系统 |
CN108665520A (zh) * | 2018-04-24 | 2018-10-16 | 微梦创科网络科技(中国)有限公司 | 一种页面动画渲染的方法及装置 |
Non-Patent Citations (1)
Title |
---|
刘易等: "基于ARM11的远程温湿度实时监控系统设计", 《电子设计工程》 * |
Cited By (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN111947680A (zh) * | 2020-09-22 | 2020-11-17 | 北京百度网讯科技有限公司 | 用于展示数据的方法、装置、设备以及存储介质 |
CN111947680B (zh) * | 2020-09-22 | 2022-08-19 | 阿波罗智联(北京)科技有限公司 | 用于展示数据的方法、装置、设备以及存储介质 |
CN113329054A (zh) * | 2021-04-27 | 2021-08-31 | 杭州壹悟科技有限公司 | 一种设备监控动画显示优化方法及装置 |
CN113329054B (zh) * | 2021-04-27 | 2022-07-12 | 杭州壹悟科技有限公司 | 一种设备监控动画显示优化方法及装置 |
CN113656729A (zh) * | 2021-07-23 | 2021-11-16 | 广州鲁邦通物联网科技有限公司 | 一种基于xml规则自动生成设备的web数据曲线的方法和系统 |
CN113741380A (zh) * | 2021-11-08 | 2021-12-03 | 西安热工研究院有限公司 | Dcs监视画面刷新方法、系统、设备及可读存储介质 |
CN113741380B (zh) * | 2021-11-08 | 2022-02-15 | 西安热工研究院有限公司 | Dcs监视画面刷新方法、系统、设备及可读存储介质 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN111435937A (zh) | 一种监控平台的刷新方法及装置 | |
AU2013352236B2 (en) | System and method for displaying multiple applications | |
US11088970B2 (en) | Interactive message display method, apparatus and system, and storage medium | |
US10496658B2 (en) | Method and system of visually depicting hierarchical data through selective colorization | |
US20140047329A1 (en) | Network Based Font Subset Management | |
CN111611518B (zh) | 基于Html5的可视化展示页面自动发布方法及系统 | |
US9396564B2 (en) | Atlas generation based on client video configuration | |
CN111949256A (zh) | 网页实时预览编辑方法、装置、设备及存储介质 | |
CN108196964A (zh) | 一种将数据流模块化的方法和装置 | |
US20160196008A1 (en) | Implementing desktops on a mobile terminal | |
CN109697055B (zh) | 生成移动App页面的方法及系统 | |
CN106919406A (zh) | 一种桌面应用组件发布、更新方法及装置 | |
CN109426597B (zh) | 应用性能监控方法、装置、设备、系统及存储介质 | |
CN110442406B (zh) | 分页控件处理数据的方法及分页控件、电子设备 | |
CN114489910B (zh) | 一种视频会议数据显示方法、装置、设备及介质 | |
CN113282852A (zh) | 编辑网页的方法和装置 | |
KR20200111736A (ko) | 동적 사용자 인터페이스 블루프린트 | |
CN113779175B (zh) | 数据处理方法、地图服务提供方法、电子设备和存储介质 | |
CN111327941B (zh) | 一种离线视频播放方法、装置、设备及介质 | |
CN115115062A (zh) | 机器学习模型建立方法、相关装置及计算机程序产品 | |
CN116360734A (zh) | 一种渲染方法、装置、存储介质及电子设备 | |
CN114371838A (zh) | 一种小程序画布渲染方法、装置、设备及存储介质 | |
CN115809363A (zh) | 内容推送方法、装置、电子设备和存储介质 | |
CN112187916A (zh) | 一种跨系统的数据同步方法与装置 | |
CN113254492B (zh) | 一种查询后台同步管理层级可视化对象的方法、装置和设备 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
RJ01 | Rejection of invention patent application after publication | ||
RJ01 | Rejection of invention patent application after publication |
Application publication date: 20200721 |