一种基于浏览器的零代码可配置显示系统的制作方法

1.本发明涉及用于将所要处理的数据转变成为计算机能够处理的形式的输入装置；用于将数据从处理机传送到输出设备的输出装置的技术领域，特别涉及一种基于浏览器的零代码可配置显示系统。


背景技术：

2.智慧园区已经成为现代建设发展关注的热点，随着信息技术迅速发展和深入应用，园区信息化发展向更高阶段的智慧化发展已成为必然趋势，包括通过数据和it系统的融合来实现园区数据的协同共享、行业的行动协调、园区的精细化运行管理等。
3.数字驾驶舱作为一种显示界面或系统，是智慧园区管理系统的基本功能，其目的是在有限的页面中集成展示园区的各项数据指标，实现园区的数字化治理。
4.园区管理方及运营方往往在项目建设阶段有着数字驾驶舱的需求，而现有的智慧园区管理系统驾驶舱解决方案主要分为数据图表式和定制大屏式两种；数据图表式是指嵌入在用户使用的园区管理系统中，抽取系统产生的业务数据并以固定样式的图表进行呈现，这类方案的优势是功能复用性高，开发一套就可以面向所有的用户进行使用，但其主要问题在于囿于架构的局限性，驾驶舱界面样式往往是固定的，无法针对不同用户的需求提供不同的驾驶舱界面样式；定制大屏式则可以针对每一位客户的需求，单独定制开发数字驾驶舱；这类方案的优势是贴合用户需求，可以结合园区的图片、建模，打造定制化的使用体验，其主要问题在于功能复用性差，同一驾驶舱页面无法面向多个用户，且开发成本高、功能定价高，需要开发单位投入大量人力物力，园区资产方需要花费数十万甚至上百万购买定制大屏功能。


技术实现要素：

5.本发明解决了现有技术中存在的问题，提供了一种优化的基于浏览器的零代码可配置显示系统，有效结合了数据图表式和定制大屏式的优点。
6.本发明所采用的技术方案是，一种基于浏览器的零代码可配置显示系统，所述系统包括：一数据及服务支撑层，用于获取数据并基于预设条件处理及融合数据；一计算与存储层，用于对数据进行二次计算、存储并整合为业务基础信息数据及界面配置信息数据；一应用显示层，于浏览器架构中，用于提取数据、基于用户设定进行界面配置并显示；所述数据及服务支撑层、计算与存储层和应用显示层顺次设置；配合所述系统配置有交互模块，所述交互模块于计算与存储层进行配置、自数据及服务支撑层获取并处理数据、以应用显示层显示。
7.优选地，配合所述数据及服务支撑层设有信息采集设备，任一所述信息采集设备
为一个节点分布设置于预设的采集区域中。
8.优选地，配置若干所述信息采集设备成组，任一组信息采集设备对应一个采集区域或采集特征；任一采集区域或采集特征的信息采集设备按预设的时间间隔及预设的推举规则推举领导节点，所述领导节点获取时间间隔内的采集数据进行数据处理及融合。
9.优选地，若任一节点误报触发率增加，则其被推举为领导节点的优先级降低。
10.优选地，为所有的所述节点配置紧急代码，当存在紧急代码时，传输的数据的左侧置入紧急代码，其他不存在紧急代码的数据左侧置0，0的个数与紧急代码的个数一致。
11.优选地，所述计算与存储层中，业务基础信息数据以项目为基本单元，任意两个项目不重复；基于数据及服务支撑层处理并融合后的数据分列若干库；所述计算与存储层中，界面配置信息数据以用户为基本单元，任意两个用户不重复；对应任一用户的显示界面唯一。
12.优选地，用户在浏览器架构中自定义配置显示界面，所述显示界面包括底图，所述底图上布设有看板、菜单项；配置包括增减看板数量、更换看板顺序、更换驾驶舱底图、修改驾驶舱分辨率、修改驾驶舱名称、修改驾驶舱菜单项名称、启用/停用驶舱菜单项。
13.优选地，配合所述交互模块设有摄像头；对于有交互权限的用户，摄像头实时采集用户姿态，判断交互内容，所述交互内容包括选中、划走和关闭。
14.优选地，所述交互权限的确认包括以下步骤：s1.1 摄像头采集背景图像作为初始图像；s1.2当摄像头采集到更新的图像后，作差、获得一个或多个交互人员图像；s1.3提取当前界面唯一识别的用户的识别信息，以识别信息与交互人员图像进行比对；s1.4若交互人员中存在当前界面唯一识别的用户，则框选当前用户，实时采集用户姿态并进行动作跟随，否则不予交互并返回s1.2。
15.优选地，所述判断交互内容包括以下步骤：s2.1 对识别到的用户，获取其双肩、举起的任一手的大臂、小臂和手掌的位置；s2.2 令大臂、小臂垂直且手掌张开为初始状态，获得对应的指尖点；s2.3实时获取手部姿态，当出现姿态变化时，判断交互内容；s2.4当获取的手部姿态中不存在指尖点，则为选中；当大臂、小臂间的角度变化且指尖点大于0，为划走，同时获取大臂和小臂的初始角度、终止角度及小臂相对于大臂的运动方向，若大臂和小臂的初始角度和终止角度与小臂相对于大臂的运动方向一致，即为显示界面的滑动方向，否则，提示重新获取；当预设时间内无法检测到大臂、小臂及手掌，则为关闭；其他情况，提示重新提交手部姿态。
16.本发明涉及一种优化的基于浏览器的零代码可配置显示系统，包括用于获取数据并基于预设条件处理及融合数据的数据及服务支撑层，以计算与存储层对数据进行二次计算、存储并整合为业务基础信息数据及界面配置信息数据，在浏览器架构中配置应用显示层，用于提取数据、基于用户设定进行界面配置并显示；数据及服务支撑层、计算与存储层和应用显示层顺次设置；配合系统配置有交互模块，于计算与存储层进行配置、自数据及服务支撑层获取并处理数据、以应用显示层显示。
17.本发明的有益效果在于：（1）支持用户在浏览器架构中自定义配置显示界面，不需要用户在代码层面进行开发或委托第三方机构进行代理开发，减少开发及项目支出；（2）每个用户可以基于个人需要配置显示界面，个性化程度高、应用灵活、展示效果好；（3）在有限的页面集成展示园区的各项数据指标，辅助园区管理人员实现园区的数字化治理。
附图说明
18.图1为本发明的结构示意图，其中，箭头所示为数据传输的方向；图2为本发明的信息采集设备分组后的示意图，其中，实心圆点为领导节点，空心圆点为普通的节点，虚线圈为不同的采集区域，箭头所示为数据传输的方向；图3为本发明中交互权限的确认的流程图；图4为本发明中判断交互内容的流程图。
具体实施方式
19.下面结合实施例对本发明做进一步的详细描述，但本发明的保护范围并不限于此。
20.实施例1如图1所示，本发明涉及一种基于浏览器的零代码可配置显示系统，所述系统包括：一数据及服务支撑层，用于获取数据并基于预设条件处理及融合数据；一计算与存储层，用于对数据进行二次计算、存储并整合为业务基础信息数据及界面配置信息数据；一应用显示层，于浏览器架构中，用于提取数据、基于用户设定进行界面配置并显示；所述数据及服务支撑层、计算与存储层和应用显示层顺次设置；配合所述系统配置有交互模块，所述交互模块于计算与存储层进行配置、自数据及服务支撑层获取并处理数据、以应用显示层显示。
21.本实施例中，以智慧园区的应用为例，显示系统的目的是在有限的页面中集成展示园区的各项数据指标，实现园区的数字化治理，其建设主要包括以下几个部分（1）通过传感器或信息采集设备全方位的获取园区运行数据；（2）将园区运行数据关联、融合、处理、分析为二次分析信息；（3）透过应用层将分析的结果数据呈现给园区运营人员；基于此，显示系统的模型架构包括三层，分别是数据及服务支撑层、计算与存储层和应用层。
22.本实施例中，数据及服务支撑层包括数据汇聚与处理、数据融合与处理、智能挖掘分析，保障上层对于数据汇聚的相关需求；这其中，对于数据的汇聚、融合及处理为本领域技术人员容易理解的内容，本领域技术人员可以依据需求自行设置，而对于数据的智能挖
掘分析是指通过算法、模型等发现数据中的隐藏信息，如通过系列数据波动发现线路的老化，进而通过数据报送火灾隐患；在数据及服务支撑层中，除了配置基本的采集设备外，用户无法触及，进而可以确保数据的安全、可信。
23.本实施例中，计算与存储层，对数据进行二次计算、存储，整合为业务基础信息数据及界面配置信息数据，这些业务基础信息数据及界面配置信息数据作为资源，可以被用户提取、利用，进而体现在实际的应用层中并进行有序显示。
24.本实施例中，应用层建立显示系统和用户的桥梁，其提取业务基础数据，并根据用户设定的界面配置信息，将数据以看板的形式呈现给用户，进而实现园区的智慧管理。
25.实施例2如图2所示，在实施例1的基础上，配合所述数据及服务支撑层设有信息采集设备，任一所述信息采集设备为一个节点分布设置于预设的采集区域中。
26.配置若干所述信息采集设备成组，任一组信息采集设备对应一个采集区域或采集特征；任一采集区域或采集特征的信息采集设备按预设的时间间隔及预设的推举规则推举领导节点，所述领导节点获取时间间隔内的采集数据进行数据处理及融合。
27.若任一节点误报触发率增加，则其被推举为领导节点的优先级降低。
28.为所有的所述节点配置紧急代码，当存在紧急代码时，传输的数据的左侧置入紧急代码，其他不存在紧急代码的数据左侧置0，0的个数与紧急代码的个数一致。
29.本实施例中，信息采集设备包括但不限于传感器、摄像头、打卡设备等，用于采集各个维度的数据，对园区的环境、人员等进行全方位的信息及数据采集。
30.本实施例中，信息采集设备以节点的形式设置，每个信息采集设备被设置在预设的区域中，如烟雾传感器被设置在各个空间中、摄像头被设置在每个通道的收尾、打卡设备被设置在各个闸口处等。
31.本实施例中，配置若干信息采集设备成组，以任一组信息采集设备对应一个采集区域或采集特征，事实上，信息采集设备成组的条件不一定必须是同类的，举出两种应用场景：场景一：以所有的烟雾传感器成组，用于对应烟气浓度的采集特征；场景二：以园区内某一层中的所有信息采集设备成组，用于获取当前采集区域中所有的信息，包括但不限于采集区域的环境信息、人员信息。
32.本实施例中，为了确保对于信息采集设备的有效利用及损耗的均摊、并且亦为了防止信息上传过程中的拥挤而造成信息丢失，成组的信息采集设备可以按预设的时间间隔及预设的推举规则推举领导节点，通过领导节点获取采集数据进行数据处理及融合，最后的上传过程亦由领导节点完成；在此过程中，预设的时间间隔一般为秒数级，确保信息更新的及时；而对于领导节点的推举，一般可以采用轮询的方式执行，或是获取空间时间较长的节点来执行，但是，考虑到某些传感器的损耗率，如烟雾传感器中的积灰而导致的报警阈值降低等，若存在某个节点误报触发率增加，则不优先推举为领导节点，并且应当及时更换。
33.本实施例中，为所有的节点配置紧急代码，这种紧急代码一般应用于用于维护安全的节点，如烟雾报警器、某些禁入场所的门禁及监控探头等；当存在紧急代码时，传输的数据的左侧置入紧急代码，其他不存在紧急代码的数据左侧置0，0的个数与紧急代码的个数一致，即长度一致，对于传输数据的值大于某个阈值的数据，触发紧急上传，即用户可以
通过显示系统的应用层界面第一时间获悉并进行对应的处理。
34.实施例3在实施例1的基础上，所述计算与存储层中，业务基础信息数据以项目为基本单元，任意两个项目不重复；基于数据及服务支撑层处理并融合后的数据分列若干库；所述计算与存储层中，界面配置信息数据以用户为基本单元，任意两个用户不重复；对应任一用户的显示界面唯一。
35.用户在浏览器架构中自定义配置显示界面，所述显示界面包括底图，所述底图上布设有看板、菜单项；配置包括增减看板数量、更换看板顺序、更换驾驶舱底图、修改驾驶舱分辨率、修改驾驶舱名称、修改驾驶舱菜单项名称、启用/停用驶舱菜单项。
36.本实施例中，显示系统的显示数据主要分为两部分，分别为业务数据和界面配置数据；业务数据以项目为基本单元，项目存在唯一识别代码，不允许重复。
37.界面配置数据以用户为基本单元，用户存在唯一识别代码，不允许重复。
38.本实施例中，由上述内容可衍生，辖区数据为多项目数据的集合，平台数据为全项目数据的集合；实际场景中，每一位用户都可以配置独有的显示界面，从而满足千人千面的展示需求。
39.本实施例中，项目业务数据由相对固定的库组成，后期维护过程根据业务和需求的变动，可能增加或减少库的种类；对于项目业务数据的库，举例说明：企业数据库，涵盖项目中入驻的企业数据，字段包括企业名称、统一社会信用代码、企业资质、企业人员信息等；合同数据库，涵盖项目中的招商租赁合同数据，字段包括起租日期、搬离日期、收费规则、收费日期等；员工数据库，涵盖项目中运营人员数据，字段包括姓名、手机号、考勤时间、任务完成情况等。
40.本实施例中，界面配置数据由相对固定的库组成，后期维护过程根据业务和需求的变动，可能增加或减少库的种类；对于界面配置数据的库，举例说明：数据看板库，涵盖数据看板的配置数据，字段包括数据看板名称、启用/停用、摆放顺序；分辨率库，存储驾驶舱分辨率的配置数据，字段包括分辨率的大小和用户的对应关系；底图库，存储用户上传的驾驶舱底图数据，字段包括底图id和用户的对应关系。
41.本实施例中，可以满足用户在浏览器架构中自定义配置驾驶舱界面，包括增减看板数量、更换看板顺序、更换驾驶舱底图、修改驾驶舱分辨率、修改驾驶舱名称、修改驾驶舱菜单项名称、启用/停用驶舱菜单项，而不需要用户在代码层面进行开发或委托第三方机构进行代理开发。
42.实施例4在实施例1的基础上，配合所述交互模块设有摄像头；对于有交互权限的用户，摄像头实时采集用户姿态，判断交互内容，所述交互内容包括选中、划走和关闭。
43.如图3所示，所述交互权限的确认包括以下步骤：
s1.1 摄像头采集背景图像作为初始图像；s1.2当摄像头采集到更新的图像后，作差、获得一个或多个交互人员图像；s1.3提取当前界面唯一识别的用户的识别信息，以识别信息与交互人员图像进行比对；s1.4若交互人员中存在当前界面唯一识别的用户，则框选当前用户，实时采集用户姿态并进行动作跟随，否则不予交互并返回s1.2。
44.如图4所示，所述判断交互内容包括以下步骤：s2.1 对识别到的用户，获取其双肩、举起的任一手的大臂、小臂和手掌的位置；s2.2 令大臂、小臂垂直且手掌张开为初始状态，获得对应的指尖点；s2.3实时获取手部姿态，当出现姿态变化时，判断交互内容；s2.4当获取的手部姿态中不存在指尖点，则为选中；当大臂、小臂间的角度变化且指尖点大于0，为划走，同时获取大臂和小臂的初始角度、终止角度及小臂相对于大臂的运动方向，若大臂和小臂的初始角度和终止角度与小臂相对于大臂的运动方向一致，即为显示界面的滑动方向，否则，提示重新获取；当预设时间内无法检测到大臂、小臂及手掌，则为关闭；其他情况，提示重新提交手部姿态。
45.本实施例中，摄像头为信息采集设备之一，此处的摄像头与显示系统设置于一体，用于采集用户的行为数据。
46.本实施例中，以摄像头采集背景图像作为初始图像，当摄像头采集到更新的图像后获取前景的一个或多个交互人员图像，当然，在实际的应用中，这个前景图像应当保持约2s以上，用于区别路过的无关人员。
47.本实施例中，由于每个显示界面拥有唯一用户，即其是由某个用户唯一设置的界面，故可以提取当前界面唯一识别的用户的识别信息，一般来说为头像，以此与交互人员的图像进行比对，若交互人员中之一为此唯一的用户，则进行框选并跟踪，事实上，除了跟踪用户外，还需要分辨其手臂及对应的手掌并跟踪，此跟踪可以通过图像处理获得，为本领域常用技术。
48.本实施例中，以手臂及对应的手掌的动作进行动作的指令的识别，一般来说，由于显示系统的主要目的是为了展示，故其主要需要具备的识别功能为选中、划走和关闭；选中是指当前展示界面选中（选定）不变；划走是指需要展示当前展示界面的上一屏或下一屏，考虑到手势识别的便利程度，每一屏为横向划动；关闭是指展示结束，可以关闭显示系统或回到某个锁屏界面（如有）。
49.本实施例中，对识别到的用户，获取其双肩、举起的任一手的大臂、小臂和手掌的位置，其中，双肩的位置用于确定其大臂的起点，以大臂和小臂获得两者的夹角，并以手掌的位置获得小臂的运动状态，还需要获得手掌的姿态，用于实现选中和关闭的识别。
50.本实施例中，令大臂、小臂垂直且手掌张开为初始状态，获得对应的指尖点，指尖点的识别结果一般需要大于4个；当手部出现姿态变化时，判断交互内容，此姿态变化包括相对于大臂、小臂的垂直及手掌的张开的变化。
51.本实施例中，当获取的手部姿态中不存在指尖点时，表示用户捏拳，令其为选中的
姿态，即暂时锁定当前界面。
52.本实施例中，当大臂、小臂间的角度变化且指尖点大于0，为划走的姿态；进一步地，需要确定划走的方向，一般来说，划走的动作只做一次，故获取大臂和小臂的初始角度、终止角度及小臂相对于大臂的运动方向，此时，若大臂和小臂的初始角度和终止角度与小臂相对于大臂的运动方向一致，即为显示界面的滑动方向，否则，提示重新获取；举例来说，用户举起右手，大臂和小臂的初始角度为135
°
、终止角度为45
°
，且小臂相对于大臂的运动方向为向左，则表示用户需要查看下一屏。
53.本实施例中，当预设时间内无法检测到大臂、小臂及手掌，则为关闭，一般此预设时间为1分钟。
54.本领域内的技术人员应明白，本发明的实施例可提供为方法、系统、或计算机程序产品。因此，本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、cd-rom、光学存储器等)上实施的计算机程序产品的形式。
55.本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
56.这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
57.这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
58.尽管已描述了本发明的优选实施例，但本领域内的技术人员一旦得知了基本创造性概念，则可对这些实施例作出另外的变更和修改。所以，所附权利要求意欲解释为包括优选实施例以及落入本发明范围的所有变更和修改。
59.显然，本领域的技术人员可以对本发明进行各种改动和变型而不脱离本发明的精神和范围。这样，倘若本发明的这些修改和变型属于本发明权利要求及其等同技术的范围之内，则本发明也意图包含这些改动和变型在内。