CN109918070A - 一种平台基于浏览器的自定义监控组态的系统及方法 - Google Patents
一种平台基于浏览器的自定义监控组态的系统及方法 Download PDFInfo
- Publication number
- CN109918070A CN109918070A CN201910041628.9A CN201910041628A CN109918070A CN 109918070 A CN109918070 A CN 109918070A CN 201910041628 A CN201910041628 A CN 201910041628A CN 109918070 A CN109918070 A CN 109918070A
- Authority
- CN
- China
- Prior art keywords
- control
- configuration
- data
- browser
- user
- 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
- 238000000034 method Methods 0.000 title claims abstract description 22
- 238000012544 monitoring process Methods 0.000 title claims abstract description 20
- 238000005516 engineering process Methods 0.000 claims abstract description 7
- 230000006399 behavior Effects 0.000 claims description 18
- 238000010422 painting Methods 0.000 claims description 11
- 230000008859 change Effects 0.000 claims description 9
- 238000012986 modification Methods 0.000 claims description 8
- 230000004048 modification Effects 0.000 claims description 8
- 230000006870 function Effects 0.000 claims description 6
- 239000002245 particle Substances 0.000 claims description 6
- 238000012163 sequencing technique Methods 0.000 claims description 6
- 230000003044 adaptive effect Effects 0.000 claims description 3
- 230000005540 biological transmission Effects 0.000 claims description 3
- 238000004321 preservation Methods 0.000 claims description 3
- 238000009877 rendering Methods 0.000 claims description 3
- 230000004044 response Effects 0.000 claims description 3
- 238000011161 development Methods 0.000 abstract description 6
- 238000013461 design Methods 0.000 abstract description 3
- 238000012827 research and development Methods 0.000 abstract description 3
- 230000010354 integration Effects 0.000 abstract description 2
- 238000010586 diagram Methods 0.000 description 2
- 239000004744 fabric Substances 0.000 description 2
- 230000009286 beneficial effect Effects 0.000 description 1
- 230000008901 benefit Effects 0.000 description 1
- 238000004891 communication Methods 0.000 description 1
Landscapes
- User Interface Of Digital Computer (AREA)
Abstract
本发明提供一平台基于浏览器的自定义监控组态的系统及方法,包括:初始化模块、菜单栏模块、工具栏模块、编辑区模块、控件栏模块、控件树模块、样式区模块、数据绑定控件模块和生成模块;本发明相对独立运行,操作简单、方便、实用,并提高监控业务的灵活性、通用性、可扩展性及可适应性,做到客户自主配置的基于浏览器自定义监控组态系统及其方法,提高了研发效率,缩短开发周期,减少开发成本,满足客户多样性、个性化和日益提高的管理应用需求,实现对“万物”的“高效、节能、安全、环保、智能”的“管、控、营”一体化。全部发明思想方法、设计方法和技术、软件编程技术及原创源程序全部属于原创发明。
Description
技术领域
本发明属于图形化界面编程领域,特别是涉及一种平台基于浏览器的自定义监控组态的系统及方法。
背景技术
物联网是在互联网的基础上,将其用户端延伸和扩展到任何物品与物品之间,进行信息交换和通信的一种网络概念,被称为继计算机、互联网之后的第三次信息技术浪潮。随着物联网的不断发展,物联网时代正以前所未有的速度影响和改变着各行业的发展。可视化实时监控作为物联网系统中的一个重要技术,是与用户接触最频繁的功能,用户体验结果会直接影响物联系统的使用效率和功能。设计和开发出符合用户需求使用的实时监控组态界面功能是非常有必要的。
目前物联网系统的实时监控界面都是定制化集成在物联平台下的一个功能模块中,而非作为一种独立的配置工具模块,独立性差,配置步骤繁琐、复杂,要求具备专业技术的开发工程师耗时耗力去开发定制才能应用,使用门槛高,研发效率低、周期长、成本高并且客户不能自主变化应用的实时监控组态界面系统软件。
发明内容
本发明目的在于提供一种平台基于浏览器的自定义监控组态的系统及方法。
为实现上述目的,本发明的技术方案如下:一平台基于浏览器的自定义监控组态的系统种,包括:初始化模块、菜单栏模块、工具栏模块、编辑区模块、控件栏模块、控件树模块、样式区模块、数据绑定控件模块和生成模块。
一种平台基于浏览器的自定义监控组态的方法,具体方法如下:
组态的初始化:
(1)当用户新建了一个组态,但还没进入编辑界面之前,系统是不会对组态进行初始化的;如果此时用户依然激活了组态且使用了这个组态,在显示界面是不会显示任何的东西的。要初始化组态,则需要至少进入一次编辑组态界面;
(2)当进入编辑组态界面时,系统会自动识别组态是否已经初始化,如果已经初始化了,则加载数据库的组态布局,并直接进入组态编辑界面;如果组态没有初始化,系统则会自动对组态进行初始;初始化时,系统会使用默认值来填充最基础的配置,然后生成一个默认的组态布局;最基础的配置包括:背景颜色、画布大小、缩放级别、显示的画布位置、控件的关系配置,待初始化完成后,自动进入组态编辑界面;
控件的显示原理:
(1)在组态界面中,每个控件的配置都是通过控件关系树来维护的;控件关系树记录了每个控件的配置信息。配置信息包括:控件的位置、控件的大小和控件自身的特有配置;
(2)本系统前端使用了Vue.js作为渲染引擎;Vue.js是以数据驱动的方式来渲染试图的,如果需要修改某个控件的显示方式,只需在控件关系树里找到这个控件的配置,然后修改这个控件配置,当控件配置被修改时,在界面中的控件显示方式就会随之改变;也就是说,如果要对界面中的控件进行编辑操作,只需修改控件关系树,当控件关系树的内容被修改时,界面的中控件也会随着控件关系树的改变而改变;
组态布局的保存和读取:
(1)当用户执行组态布局保存操作的时候,浏览器会把控件关系树转换成JSON字符串;然后发送给服务器,服务器会把这个JSON字符串保存到数据库,保存操作完成;
(2)当用户需要读取组态时,浏览器会从服务器获取之前保存的JSON字符串,然后把这个JSON字符串还原为控件关系树;然后把这个控件关系树直接赋值到Vue.js的数据区域,组态界面就会随着控件关系树的赋值操作而被显示出来;
控件栏:控件栏是用于新增新控件的; 在组态编辑界面中,当用户的光标移动到控件栏的某个控件上方,并且按下鼠标左键,按下但不释放,编辑界面会进入控件新增状态,并且生成一个相关的,且带默认值的控件在光标右下角;如果此时移动光标,浏览器会马上更新新控件的位置,让新控件能够跟随光标的移动而移动;当用户释放鼠标左键时,编辑界面会识别新控件的当前位置:如果新控件的当前位置不在画布内,表示用户取消了新控件的添加操作,浏览器会把新控件删除;如果新控件在画布内,则把新控件插入到控件关系树,让新控件新增到画布内;
控件的选择:
(1)当要修改某个控件的配置时,需要对控件进行选择。如果需要对控件进行选择,可以在画布直接点击要编辑的控件,也可以点击在控件树种的控件来选择控件;
(2)当用户选择了一个控件时,浏览器会在控件关系树中找到与这个控件对应的节点,然后会把这个控件节点放到公共选择区域,当这个控件节点放到公共选择区域后,可以被其他Vue组件修改;
(3)当用户在其他Vue组件修改了这个控件的配置时,会把修改的数据直接反馈到控件关系树,从而直接反馈到控件的显示中;
控件的自由拖放:
(1)当用户选择了一个控件时,会进入自由拖放模式。在显示画布中,被选择的控件四周有8个小白点;
(2)用户光标移动到某一个小白点上,按下鼠标左键,按下但不释放,系统会进入光标捕捉模式。此时当用户移动光标时,会触发控件大小的重新计算事件,当控件大小重新计算后,会把控件数据直接写入到控件关系树里,随后把计算后的控件大小如实的显示出来,这样就能实现控件的自由拖放了;
(3)当用户释放鼠标左键时,系统会退出自由拖放模式;
控件树:由于控件关系树仅仅是数据,为了让用户能够更直观地查看控件关系树,本系统提供了控件树; 控件树是把控件关系树以树状图的方式显示出来的控件;该控件显示了当前组态有多少个控件,还会显示所有控件之间的关系;用户也可以通过点击里面的控件来对控件进行选择;
样式面板:样式面板用于编辑当前选定控件的样式; 样式面板会根据公共选择区域里的控件节点,显示不同的内容;如果用户在样式面板对控件样式进行了修改,那么修改的数据会直接反馈到控件关系树,然后控件关系树又会直接反馈到界面;因此用户一旦在控件面板修改了样式,Vue.js会把修改的内容直接反馈到界面上;
数据/行为面板:数据、行为面板用于控制控件绑定的数据; 当进入组态界面时,浏览器会预先加载所有可以绑定的数据或行为; 数据/行为面板会根据公共选择区域里的控件节点,显示可以绑定的数据或行为,该数据或行为仅对运行中的组态有影响;
控件显示的覆盖顺序:
(1)当有一些控件都在同一位置的时候,这时候就会出现控件显示的先后顺序的问题;在控件关系树中,每个控件都有一个属性:显示顺序;用户可以通过点击工具栏中的上移一层、下移一层、移至顶层或移至底层来调整控件的显示顺序;
(2)在本系统中,控件的显示顺序是使用css里的z-index属性来实现的;在显示控件之前,本系统会对所有控件的显示顺序进行排序,排好序后,从头到尾按顺序重新填充编号;然后把这个编号填充到对应控件元素里的z-index属性。随后浏览器会根据这个z-index属性,来确定控件的显示顺序
运行中的数据实时显示:
(1)组态数据的实时显示使用了浏览器的WebSocket技术,并且使用了Stomp作为传输协议;当服务器采集到一个数据后,该数据会通过Stomp协议来进行订阅信息的发布,而发布的内容就是采集到的这个数据;
(2)浏览器在运行组态的时候,会使用Stomp协议对实时信息进行订阅,订阅后,会一直等待服务器。一旦服务器进行数据的发布,已订阅的浏览器就会收到服务器发来的新数据了;
(3)浏览器一旦收到新数据,会对新数据进行一系列的状态计算,最后写入到控件中进行显示;
实时数据连接状态:组态会把新采集数据的时间戳与当前时间戳进行对比,计算出时间戳差值,从而计算出数据是多久之前采集的;并且使用了定时器,每过一秒钟就会触发一次对比函数;如果时间戳差值超过一定时间,就会判断为断线,并显示到对应控件中;
组态的屏幕自适应技术:本系统里组态的自适应是使用浏览器响应式布局和css3来实现的。
本发明的有益效果是:本发明相对独立运行,操作简单、方便、实用,并提高监控业务的灵活性、通用性、可扩展性及可适应性,做到客户自主配置的基于浏览器自定义监控组态系统及其方法,提高了研发效率,缩短开发周期,减少开发成本,满足客户多样性、个性化和日益提高的管理应用需求,实现对“万物”的“高效、节能、安全、环保、智能”的“管、控、营”一体化。全部发明思想方法、设计方法和技术、软件编程技术及原创源程序全部属于原创发明。
附图说明
图1是物联应用平台基于浏览器的自定义监控组态功能模块示意图。
图2是基于浏览器的自定义监控组态的系统界面示意图。
具体实施方式
结合图1至图2所示:一种平台基于浏览器的自定义监控组态的系统,包括:初始化模块、菜单栏模块、工具栏模块、编辑区模块、控件栏模块、控件树模块、样式区模块、数据绑定控件模块和生成模块。
一种平台基于浏览器的自定义监控组态的方法,具体方法如下:
组态的初始化:
(1)当用户新建了一个组态,但还没进入编辑界面之前,系统是不会对组态进行初始化的;如果此时用户依然激活了组态且使用了这个组态,在显示界面是不会显示任何的东西的。要初始化组态,则需要至少进入一次编辑组态界面;
(2)当进入编辑组态界面时,系统会自动识别组态是否已经初始化,如果已经初始化了,则加载数据库的组态布局,并直接进入组态编辑界面;如果组态没有初始化,系统则会自动对组态进行初始;初始化时,系统会使用默认值来填充最基础的配置,然后生成一个默认的组态布局;最基础的配置包括:背景颜色、画布大小、缩放级别、显示的画布位置、控件的关系配置,待初始化完成后,自动进入组态编辑界面;
控件的显示原理:
(3)在组态界面中,每个控件的配置都是通过控件关系树来维护的;控件关系树记录了每个控件的配置信息。配置信息包括:控件的位置、控件的大小和控件自身的特有配置;
(4)本系统前端使用了Vue.js作为渲染引擎;Vue.js是以数据驱动的方式来渲染试图的,如果需要修改某个控件的显示方式,只需在控件关系树里找到这个控件的配置,然后修改这个控件配置,当控件配置被修改时,在界面中的控件显示方式就会随之改变;也就是说,如果要对界面中的控件进行编辑操作,只需修改控件关系树,当控件关系树的内容被修改时,界面的中控件也会随着控件关系树的改变而改变;
组态布局的保存和读取:
(3)当用户执行组态布局保存操作的时候,浏览器会把控件关系树转换成JSON字符串;然后发送给服务器,服务器会把这个JSON字符串保存到数据库,保存操作完成;
(4)当用户需要读取组态时,浏览器会从服务器获取之前保存的JSON字符串,然后把这个JSON字符串还原为控件关系树;然后把这个控件关系树直接赋值到Vue.js的数据区域,组态界面就会随着控件关系树的赋值操作而被显示出来;
控件栏:控件栏是用于新增新控件的; 在组态编辑界面中,当用户的光标移动到控件栏的某个控件上方,并且按下鼠标左键,按下但不释放,编辑界面会进入控件新增状态,并且生成一个相关的,且带默认值的控件在光标右下角;如果此时移动光标,浏览器会马上更新新控件的位置,让新控件能够跟随光标的移动而移动;当用户释放鼠标左键时,编辑界面会识别新控件的当前位置:如果新控件的当前位置不在画布内,表示用户取消了新控件的添加操作,浏览器会把新控件删除;如果新控件在画布内,则把新控件插入到控件关系树,让新控件新增到画布内;
控件的选择:
(4)当要修改某个控件的配置时,需要对控件进行选择。如果需要对控件进行选择,可以在画布直接点击要编辑的控件,也可以点击在控件树种的控件来选择控件;
(5)当用户选择了一个控件时,浏览器会在控件关系树中找到与这个控件对应的节点,然后会把这个控件节点放到公共选择区域,当这个控件节点放到公共选择区域后,可以被其他Vue组件修改;
(6)当用户在其他Vue组件修改了这个控件的配置时,会把修改的数据直接反馈到控件关系树,从而直接反馈到控件的显示中;
控件的自由拖放:
(4)当用户选择了一个控件时,会进入自由拖放模式。在显示画布中,被选择的控件四周有8个小白点;
(5)用户光标移动到某一个小白点上,按下鼠标左键,按下但不释放,系统会进入光标捕捉模式。此时当用户移动光标时,会触发控件大小的重新计算事件,当控件大小重新计算后,会把控件数据直接写入到控件关系树里,随后把计算后的控件大小如实的显示出来,这样就能实现控件的自由拖放了;
(6)当用户释放鼠标左键时,系统会退出自由拖放模式;
控件树:由于控件关系树仅仅是数据,为了让用户能够更直观地查看控件关系树,本系统提供了控件树; 控件树是把控件关系树以树状图的方式显示出来的控件;该控件显示了当前组态有多少个控件,还会显示所有控件之间的关系;用户也可以通过点击里面的控件来对控件进行选择;
样式面板:样式面板用于编辑当前选定控件的样式; 样式面板会根据公共选择区域里的控件节点,显示不同的内容;如果用户在样式面板对控件样式进行了修改,那么修改的数据会直接反馈到控件关系树,然后控件关系树又会直接反馈到界面;因此用户一旦在控件面板修改了样式,Vue.js会把修改的内容直接反馈到界面上;
数据/行为面板:数据、行为面板用于控制控件绑定的数据; 当进入组态界面时,浏览器会预先加载所有可以绑定的数据或行为; 数据/行为面板会根据公共选择区域里的控件节点,显示可以绑定的数据或行为,该数据或行为仅对运行中的组态有影响;
控件显示的覆盖顺序:
(3)当有一些控件都在同一位置的时候,这时候就会出现控件显示的先后顺序的问题;在控件关系树中,每个控件都有一个属性:显示顺序;用户可以通过点击工具栏中的上移一层、下移一层、移至顶层或移至底层来调整控件的显示顺序;
(4)在本系统中,控件的显示顺序是使用css里的z-index属性来实现的;在显示控件之前,本系统会对所有控件的显示顺序进行排序,排好序后,从头到尾按顺序重新填充编号;然后把这个编号填充到对应控件元素里的z-index属性。随后浏览器会根据这个z-index属性,来确定控件的显示顺序
运行中的数据实时显示:
(4)组态数据的实时显示使用了浏览器的WebSocket技术,并且使用了Stomp作为传输协议;当服务器采集到一个数据后,该数据会通过Stomp协议来进行订阅信息的发布,而发布的内容就是采集到的这个数据;
(5)浏览器在运行组态的时候,会使用Stomp协议对实时信息进行订阅,订阅后,会一直等待服务器。一旦服务器进行数据的发布,已订阅的浏览器就会收到服务器发来的新数据了;
(6)浏览器一旦收到新数据,会对新数据进行一系列的状态计算,最后写入到控件中进行显示;
实时数据连接状态:组态会把新采集数据的时间戳与当前时间戳进行对比,计算出时间戳差值,从而计算出数据是多久之前采集的;并且使用了定时器,每过一秒钟就会触发一次对比函数;如果时间戳差值超过一定时间,就会判断为断线,并显示到对应控件中;
组态的屏幕自适应技术:本系统里组态的自适应是使用浏览器响应式布局和css3来实现的。
对于本领域技术人员而言,显然本发明不限于上述示范性实施例的细节,而且在不背离本发明的精神或基本特征的情况下,能够以其他的具体形式实现本发明。因此,无论从哪一点来看,均应将实施例看作是示范性的,而且是非限制性的,本发明的范围由所附权利要求而不是上述说明限定,因此旨在将落在权利要求的等同要件的含义和范围内的所有变化囊括在本发明内。不应将权利要求中的任何附图标记视为限制所涉及的权利要求。
Claims (2)
1.一种平台基于浏览器的自定义监控组态的系统,其特征在于,包括:初始化模块、菜单栏模块、工具栏模块、编辑区模块、控件栏模块、控件树模块、样式区模块、数据绑定控件模块和生成模块。
2.一种平台基于浏览器的自定义监控组态的方法,其特征在于,具体方法如下:
组态的初始化:
(1)当用户新建了一个组态,但还没进入编辑界面之前,系统是不会对组态进行初始化的;如果此时用户依然激活了组态且使用了这个组态,在显示界面是不会显示任何的东西的;要初始化组态,则需要至少进入一次编辑组态界面;
(2)当进入编辑组态界面时,系统会自动识别组态是否已经初始化,如果已经初始化了,则加载数据库的组态布局,并直接进入组态编辑界面;如果组态没有初始化,系统则会自动对组态进行初始;初始化时,系统会使用默认值来填充最基础的配置,然后生成一个默认的组态布局;最基础的配置包括:背景颜色、画布大小、缩放级别、显示的画布位置、控件的关系配置,待初始化完成后,自动进入组态编辑界面;
控件的显示原理:
在组态界面中,每个控件的配置都是通过控件关系树来维护的;控件关系树记录了每个控件的配置信息,配置信息包括:控件的位置、控件的大小和控件自身的特有配置;
本系统前端使用了Vue.js作为渲染引擎;Vue.js是以数据驱动的方式来渲染试图的,如果需要修改某个控件的显示方式,只需在控件关系树里找到这个控件的配置,然后修改这个控件配置,当控件配置被修改时,在界面中的控件显示方式就会随之改变;也就是说,如果要对界面中的控件进行编辑操作,只需修改控件关系树,当控件关系树的内容被修改时,界面的中控件也会随着控件关系树的改变而改变;
组态布局的保存和读取:
当用户执行组态布局保存操作的时候,浏览器会把控件关系树转换成JSON字符串;然后发送给服务器,服务器会把这个JSON字符串保存到数据库,保存操作完成;
当用户需要读取组态时,浏览器会从服务器获取之前保存的JSON字符串,然后把这个JSON字符串还原为控件关系树;然后把这个控件关系树直接赋值到Vue.js的数据区域,组态界面就会随着控件关系树的赋值操作而被显示出来;
控件栏:控件栏是用于新增新控件的;在组态编辑界面中,当用户的光标移动到控件栏的某个控件上方,并且按下鼠标左键,按下但不释放,编辑界面会进入控件新增状态,并且生成一个相关的,且带默认值的控件在光标右下角;如果此时移动光标,浏览器会马上更新新控件的位置,让新控件能够跟随光标的移动而移动;当用户释放鼠标左键时,编辑界面会识别新控件的当前位置:如果新控件的当前位置不在画布内,表示用户取消了新控件的添加操作,浏览器会把新控件删除;如果新控件在画布内,则把新控件插入到控件关系树,让新控件新增到画布内;
控件的选择:
当要修改某个控件的配置时,需要对控件进行选择,如果需要对控件进行选择,可以在画布直接点击要编辑的控件,也可以点击在控件树种的控件来选择控件;
当用户选择了一个控件时,浏览器会在控件关系树中找到与这个控件对应的节点,然后会把这个控件节点放到公共选择区域,当这个控件节点放到公共选择区域后,可以被其他Vue组件修改;
当用户在其他Vue组件修改了这个控件的配置时,会把修改的数据直接反馈到控件关系树,从而直接反馈到控件的显示中;
控件的自由拖放:
当用户选择了一个控件时,会进入自由拖放模式,在显示画布中,被选择的控件四周有8个小白点;
用户光标移动到某一个小白点上,按下鼠标左键,按下但不释放,系统会进入光标捕捉模式;此时当用户移动光标时,会触发控件大小的重新计算事件,当控件大小重新计算后,会把控件数据直接写入到控件关系树里,随后把计算后的控件大小如实的显示出来,这样就能实现控件的自由拖放了;
当用户释放鼠标左键时,系统会退出自由拖放模式;
控件树:由于控件关系树仅仅是数据,为了让用户能够更直观地查看控件关系树,本系统提供了控件树;控件树是把控件关系树以树状图的方式显示出来的控件;该控件显示了当前组态有多少个控件,还会显示所有控件之间的关系;用户也可以通过点击里面的控件来对控件进行选择;
样式面板:样式面板用于编辑当前选定控件的样式;样式面板会根据公共选择区域里的控件节点,显示不同的内容;如果用户在样式面板对控件样式进行了修改,那么修改的数据会直接反馈到控件关系树,然后控件关系树又会直接反馈到界面;因此用户一旦在控件面板修改了样式,Vue.js会把修改的内容直接反馈到界面上;
数据、行为面板:数据、行为面板用于控制控件绑定的数据;当进入组态界面时,浏览器会预先加载所有可以绑定的数据或行为;数据、行为面板会根据公共选择区域里的控件节点,显示可以绑定的数据或行为,该数据或行为仅对运行中的组态有影响;
控件显示的覆盖顺序:
当有一些控件都在同一位置的时候,这时候就会出现控件显示的先后顺序的问题;在控件关系树中,每个控件都有一个属性:显示顺序;用户可以通过点击工具栏中的上移一层、下移一层、移至顶层或移至底层来调整控件的显示顺序;
在本系统中,控件的显示顺序是使用css里的z-index属性来实现的;在显示控件之前,本系统会对所有控件的显示顺序进行排序,排好序后,从头到尾按顺序重新填充编号;然后把这个编号填充到对应控件元素里的z-index属性,随后浏览器会根据这个z-index属性,来确定控件的显示顺序;
运行中的数据实时显示:
组态数据的实时显示使用了浏览器的WebSocket技术,并且使用了Stomp作为传输协议;当服务器采集到一个数据后,该数据会通过Stomp协议来进行订阅信息的发布,而发布的内容就是采集到的这个数据;
浏览器在运行组态的时候,会使用Stomp协议对实时信息进行订阅,订阅后,会一直等待服务器,一旦服务器进行数据的发布,已订阅的浏览器就会收到服务器发来的新数据了;
浏览器一旦收到新数据,会对新数据进行一系列的状态计算,最后写入到控件中进行显示;
实时数据连接状态:组态会把新采集数据的时间戳与当前时间戳进行对比,计算出时间戳差值,从而计算出数据是多久之前采集的;并且使用了定时器,每过一秒钟就会触发一次对比函数;如果时间戳差值超过一定时间,就会判断为断线,并显示到对应控件中;
组态的屏幕自适应技术:本系统里组态的自适应是使用浏览器响应式布局和css3来实现的。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910041628.9A CN109918070A (zh) | 2019-03-30 | 2019-03-30 | 一种平台基于浏览器的自定义监控组态的系统及方法 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201910041628.9A CN109918070A (zh) | 2019-03-30 | 2019-03-30 | 一种平台基于浏览器的自定义监控组态的系统及方法 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN109918070A true CN109918070A (zh) | 2019-06-21 |
Family
ID=66960431
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201910041628.9A Pending CN109918070A (zh) | 2019-03-30 | 2019-03-30 | 一种平台基于浏览器的自定义监控组态的系统及方法 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN109918070A (zh) |
Cited By (7)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110968316A (zh) * | 2019-12-02 | 2020-04-07 | 山东有人信息技术有限公司 | 一种基于浏览器的组态编辑器及编辑方法 |
CN111369641A (zh) * | 2020-03-04 | 2020-07-03 | 上海上实龙创智慧能源科技股份有限公司 | 一种基于Vue.js框架的污水处理工艺图组态方法 |
CN112035188A (zh) * | 2020-09-28 | 2020-12-04 | 中移(杭州)信息技术有限公司 | 控件生成方法、装置、网络设备及存储介质 |
CN112364496A (zh) * | 2020-11-03 | 2021-02-12 | 中国航空无线电电子研究所 | 基于html5和vue技术的航电仿真面板生成系统 |
CN112579081A (zh) * | 2019-09-30 | 2021-03-30 | 比亚迪股份有限公司 | 信息处理方法、装置、服务器及存储介质 |
CN114064188A (zh) * | 2022-01-18 | 2022-02-18 | 深圳微迅信息科技有限公司 | 一种监控界面的设计方法、设计装置及电子设备 |
CN117170632A (zh) * | 2023-11-02 | 2023-12-05 | 浙江大学 | 基于Vue的SysML模型仿真的用户界面开发系统 |
Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101877716A (zh) * | 2010-03-10 | 2010-11-03 | 艾默生网络能源有限公司 | 组态模板的定制方法、组态模板的显示方法及服务器 |
CN101944027A (zh) * | 2010-09-26 | 2011-01-12 | 北京神州泰岳软件股份有限公司 | 一种用户界面生成方法 |
CN102915349A (zh) * | 2012-09-27 | 2013-02-06 | 北京奇虎科技有限公司 | 在浏览器中显示网页的方法及在浏览器中显示的网页组件 |
CN103955366A (zh) * | 2014-04-18 | 2014-07-30 | 南威软件股份有限公司 | 一种可视化网站模版的制作方法 |
CN104731584A (zh) * | 2015-02-26 | 2015-06-24 | 武汉爱科唯自动化科技有限公司 | 一种开放式数控系统人机界面可定制的组态设计方法 |
CN104793929A (zh) * | 2015-02-15 | 2015-07-22 | 深圳市中兴移动通信有限公司 | 应用界面显示信息的自定义方法及装置 |
CN106776247A (zh) * | 2016-11-23 | 2017-05-31 | 腾云天宇科技(北京)有限公司 | 一种监控应用中控件的方法、服务器及系统 |
CN109408188A (zh) * | 2018-11-02 | 2019-03-01 | 山东浪潮商用系统有限公司 | 一种控件化自定义智能电视软件Launcher界面的方法 |
CN109460232A (zh) * | 2018-09-27 | 2019-03-12 | 深圳新基点智能股份有限公司 | 一种组态页面的制作和监控方法 |
-
2019
- 2019-03-30 CN CN201910041628.9A patent/CN109918070A/zh active Pending
Patent Citations (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101877716A (zh) * | 2010-03-10 | 2010-11-03 | 艾默生网络能源有限公司 | 组态模板的定制方法、组态模板的显示方法及服务器 |
CN101944027A (zh) * | 2010-09-26 | 2011-01-12 | 北京神州泰岳软件股份有限公司 | 一种用户界面生成方法 |
CN102915349A (zh) * | 2012-09-27 | 2013-02-06 | 北京奇虎科技有限公司 | 在浏览器中显示网页的方法及在浏览器中显示的网页组件 |
CN103955366A (zh) * | 2014-04-18 | 2014-07-30 | 南威软件股份有限公司 | 一种可视化网站模版的制作方法 |
CN104793929A (zh) * | 2015-02-15 | 2015-07-22 | 深圳市中兴移动通信有限公司 | 应用界面显示信息的自定义方法及装置 |
CN104731584A (zh) * | 2015-02-26 | 2015-06-24 | 武汉爱科唯自动化科技有限公司 | 一种开放式数控系统人机界面可定制的组态设计方法 |
CN106776247A (zh) * | 2016-11-23 | 2017-05-31 | 腾云天宇科技(北京)有限公司 | 一种监控应用中控件的方法、服务器及系统 |
CN109460232A (zh) * | 2018-09-27 | 2019-03-12 | 深圳新基点智能股份有限公司 | 一种组态页面的制作和监控方法 |
CN109408188A (zh) * | 2018-11-02 | 2019-03-01 | 山东浪潮商用系统有限公司 | 一种控件化自定义智能电视软件Launcher界面的方法 |
Non-Patent Citations (1)
Title |
---|
张利等: "基于ActiVeX的Web组态软件及其浏览器的研究", 《仪器仪表学报》 * |
Cited By (9)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN112579081A (zh) * | 2019-09-30 | 2021-03-30 | 比亚迪股份有限公司 | 信息处理方法、装置、服务器及存储介质 |
CN110968316A (zh) * | 2019-12-02 | 2020-04-07 | 山东有人信息技术有限公司 | 一种基于浏览器的组态编辑器及编辑方法 |
CN111369641A (zh) * | 2020-03-04 | 2020-07-03 | 上海上实龙创智慧能源科技股份有限公司 | 一种基于Vue.js框架的污水处理工艺图组态方法 |
CN112035188A (zh) * | 2020-09-28 | 2020-12-04 | 中移(杭州)信息技术有限公司 | 控件生成方法、装置、网络设备及存储介质 |
CN112364496A (zh) * | 2020-11-03 | 2021-02-12 | 中国航空无线电电子研究所 | 基于html5和vue技术的航电仿真面板生成系统 |
CN112364496B (zh) * | 2020-11-03 | 2024-01-30 | 中国航空无线电电子研究所 | 基于html5和vue技术的航电仿真面板生成系统 |
CN114064188A (zh) * | 2022-01-18 | 2022-02-18 | 深圳微迅信息科技有限公司 | 一种监控界面的设计方法、设计装置及电子设备 |
CN117170632A (zh) * | 2023-11-02 | 2023-12-05 | 浙江大学 | 基于Vue的SysML模型仿真的用户界面开发系统 |
CN117170632B (zh) * | 2023-11-02 | 2024-02-09 | 浙江大学 | 基于Vue的SysML模型仿真的用户界面开发系统 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN109918070A (zh) | 一种平台基于浏览器的自定义监控组态的系统及方法 | |
CN105653644B (zh) | 一种页面构造器及页面构造方法 | |
CN104731584B (zh) | 一种开放式数控系统人机界面可定制的组态设计方法 | |
CN109117138B (zh) | 一种组态方法及装置、计算机可读存储介质 | |
CN110399420A (zh) | 一种可配置化Excel格式的导出方法、电子设备和介质 | |
CN108428112A (zh) | 一种表单的生成方法、装置、计算机和存储介质 | |
CN106406794A (zh) | 一种屏幕适配方法及其装置 | |
CN110851134A (zh) | 低代码页面设计装置及页面设计方法 | |
CN109375914B (zh) | 信息远程交互方法和系统 | |
CN105094832A (zh) | 一种所见即所得的动态生成用户界面的方法和系统 | |
CN103714492A (zh) | 符合配电网管理特定数据标准的自动报告生成方法 | |
EP3367266A1 (en) | Page construction method, terminal, computer-readable storage medium and page construction device | |
CN104657384A (zh) | 一种基于二维关系的动态配置报表数据处理方法 | |
CN111881662A (zh) | 表单生成方法、装置、处理设备及存储介质 | |
CN109508187A (zh) | 基于html的微信公众号图文编辑器构建方法及其编辑器 | |
CN109710250A (zh) | 一种用于构建用户界面的可视化引擎系统及方法 | |
CN114564176A (zh) | 一种代码开发方法、服务器及存储介质 | |
CN109739490A (zh) | 一种基于qt图形框架的电气元件模型快速创建方法 | |
CN112685025A (zh) | 快速搭建前端页面的方法及系统 | |
CN114564199A (zh) | 一种生成使用页面的方法、装置、设备及可读存储介质 | |
CN105468573A (zh) | 可配置式图表应用系统 | |
CN106126254B (zh) | 一种关联的平视界面游戏编辑系统与方法 | |
CN109086040A (zh) | 一种快速生成html代码的方法和系统 | |
CN104077669A (zh) | 一种计算机工作流的自主定制与驱动执行的通用方法 | |
CN104731804A (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 |
Application publication date: 20190621 |
|
RJ01 | Rejection of invention patent application after publication |