技术摘要：
本发明公开了一种基于Html5的可视化展示页面自动发布方法，包括获取由可视化设计器编辑生成的可视化画面ZIP文件流；按照预设的转换规则，将所述可视化画面ZIP文件流中转换为Html5页面；响应于浏览器请求所述Html5页面的信号，对所述Html5页面进行实例化，完成画面渲染  全部
背景技术：
当前可视化设计器已具备图形界面配置页面布局、样式属性、数据绑定、页面交互 的能力，页面持久化文件已经有了成熟的规范定义，包括控件、布局、图层、画面参数等，画 面文件为XML布局描述文件和资源文件，然而，画面渲染播放器是基于WPF技术开发，用设计 器设计的画面只能在Windows环境下的以客户端窗口模式展示。
技术实现要素：
针对上述问题，本发明提出一种基于Html5的可视化展示页面自动发布方法及系 统，利用Html5技术开发出页面发布引擎和页面渲染展示引擎，实现可视化设计器页面一处 设计多处展示，解决跨平台展示的问题。 为了实现上述技术目的，达到上述技术效果，本发明通过以下技术方案实现： 第一方面，本发明提供了一种基于Html5的可视化展示页面自动发布方法，包括： 获取由可视化设计器编辑生成的可视化画面ZIP文件流； 按照预设的转换规则，将所述可视化画面ZIP文件流中转换为Html5页面； 响应于浏览器请求所述Html5页面的信号，对所述Html5页面进行实例化，完成画 面渲染展示和控件数据初始化； 基于设定的刷新间隔，对所述控件数据进行定时刷新，完成基于Html5的可视化展 示页面自动发布。 可选地，所述Html5页面的生成过程包括： 遍历所述可视化画面ZIP文件流中的各个子文件； 当子文件为页面描述XML文件时，则获取该子文件中的所有节点，根据预设的转换 规范将节点及节点的配置属性转换为JS脚本字符串； 创建Html5文档对象的head、body节点，并将所述js字符串作为body部分的script 属性值，最后把生成的Html5文档对象写入到服务端画面目录，至此完成了Html5页面的转 换； 当子文件为自定义页面js文件或Resource文件，则直接解压到服务端目录。 可选地，所述预设的转换规范是指将页面描述XML文件解析转义成Html5文档结构 的规范定义，页面描述XML文件中每个组件配置属性部分通过JSON的XML工具类转换为 JSONObject对象，组件元素标签部分则直接生成实例化JS脚本。 可选地，所述对所述Html5页面进行实例化，完成画面渲染展示和控件数据初始 化，包括： 基于所述Html5页面，创建画面容器； 5 CN 111611518 A 说　明　书 2/11 页 根据所述Html5页面中相关内容的JSON配置属性信息分别创建展现数据集、画面 参数实例、画面图层实例、控件动画实例；所述画面参数实例通过属性DesignerValue赋值， 设置画面参数改变事件OnPropertyChanged；所述画面图层实例关联Html5页面上的控件属 性，添加图层显示和隐藏事件；所述控件动画实例在加载完成之后，调用动画事件； 根据控件JSON配置属性值，按照控件顺序依次创建页面控件对象，然后将对象添 加到画面容器中，再调用控件的初始化方法，初始化控件内容； 页面和控件加载完成之后，开始请求画面数据，通过DataService请求数据，过滤 页面上已经绑定了控件的数据集，然后组装请求参数templateReq，发送到后台服务请求数 据，后台通过解析templateReq，获取数据集的配置属性，完成数据查询，并将结果返回JSON 格式的数据； 接收到的JSON格式的数据，需要根据展现数据集Id匹配页面上控件绑定的展现数 据集，然后给展现数据集的DataSet赋值。同一个数据集可能绑定了多个控件，需要获取到 数据集绑定的集合BindObjects，然后通过BusinessBinding的Value值，分别将数据传递给 控件，在BusinessBinding获取到值之后，需要对多条数据遍历并调用数据转换器，将JSON 格式数据转换成控件需要的数据，最后调用控件的UpdateData方法，更新控件数据，完成画 面渲染展示和控件数据初始化。 可选地，所述基于设定的刷新间隔，对所述控件数据进行定时刷新，包括： 对画面上的所有展现数据集进行遍历，过滤掉没有绑定控件的展现数据集，将已 绑定控件的展现数据集的刷新频率对象IntervalObject添加到全局IntervalObjectList 列表中，IntervalObject对象包含控件刷新频率TimerInterval、计时变量CountNum、数据 集标识DatasourceId属性； 启动全局页面刷新定时器，维护IntervalObjectList列表的数据； 所述全局页面刷新定时器触发时，将Interva lO bjectList列表中各个 IntervalObject的计时器变量CountNum值递减1，当CountNum<0的时候，表示此数据集刷新 时间到了，即将数据集添加到Ajax请求队列请求数据集查询数据； 将CountNum<0的展现数据集，组装templateReq请求数据，并通过Ajax请求后台服 务数据查询接口，数据查询结果dataSources以JSON格式传输到客户端； 成功接收数据后，遍历所有接收的数据，根据展现数据集ID，将数据分别赋值给展 现数据集的Data属性； 将数据集刷新频率对象的计时器变量Co u n t N u m复位为控件刷新频率 TimerInterval的值，继续循环计时。 第二方面，本发明提供了一种基于Html5的可视化展示页面自动发布系统，包括： 可视化设计器，编辑生成的可视化画面ZIP文件流； Html5页面发布引擎，按照预设的转换规则，将所述可视化画面ZIP文件流中转换 为Html5页面； Html5页面渲染展示引擎，响应于浏览器请求所述Html5页面的信号，对所述Html5 页面进行实例化，完成画面渲染展示和控件数据初始化； 数据刷新模块，基于设定的刷新间隔，对所述控件数据进行定时刷新，完成基于 Html5的可视化展示页面自动发布。 6 CN 111611518 A 说　明　书 3/11 页 可选地，所述Html5页面的生成过程包括： 遍历所述可视化画面ZIP文件流中的各个子文件； 当子文件为页面描述XML文件时，则获取该子文件中的所有节点，根据预设的转换 规范将节点及节点的配置属性转换为JS脚本字符串； 创建Html5文档对象的head、body节点，并将所述js字符串作为body部分的script 属性值，最后把生成的Html5文档对象写入到服务端画面目录，至此完成了Html5页面的转 换； 当子文件为自定义页面js文件或Resource文件，则直接解压到服务端目录。 可选地，所述对所述Html5页面进行实例化，完成画面渲染展示和控件数据初始 化，包括： 基于所述Html5页面，创建画面容器； 根据所述Html5页面中相关内容的JSON配置属性信息分别创建展现数据集、画面 参数实例、画面图层实例、控件动画实例；所述画面参数实例通过属性DesignerValue赋值， 设置画面参数改变事件OnPropertyChanged；所述画面图层实例关联Html5页面上的控件属 性，添加图层显示和隐藏事件；所述控件动画实例在加载完成之后，调用动画事件； 根据控件JSON配置属性值，按照控件顺序依次创建页面控件对象，然后将对象添 加到画面容器中，再调用控件的初始化方法，初始化控件内容； 页面和控件加载完成之后，开始请求画面数据，通过DataService请求数据，过滤 页面上已经绑定了控件的数据集，然后组装请求参数templateReq，发送到后台服务请求数 据，后台通过解析templateReq，获取数据集的配置属性，完成数据查询，并将结果返回JSON 格式的数据； 接收到的JSON格式的数据，需要根据展现数据集Id匹配页面上控件绑定的展现数 据集，然后给展现数据集的DataSet赋值。同一个数据集可能绑定了多个控件，需要获取到 数据集绑定的集合BindObjects，然后通过BusinessBinding的Value值，分别将数据传递给 控件，在BusinessBinding获取到值之后，需要对多条数据遍历并调用数据转换器，将JSON 格式数据转换成控件需要的数据，最后调用控件的UpdateData方法，更新控件数据，完成画 面渲染展示和控件数据初始化。 可选地，所述基于设定的刷新间隔，对所述控件数据进行定时刷新，包括： 对画面上的所有展现数据集进行遍历，过滤掉没有绑定控件的展现数据集，将已 绑定控件的展现数据集的刷新频率对象IntervalObject添加到全局IntervalObjectList 列表中，IntervalObject对象包含控件刷新频率TimerInterval、计时变量CountNum、数据 集标识DatasourceId属性； 启动全局页面刷新定时器，维护IntervalObjectList列表的数据； 所述全局页面刷新定时器触发时，将Interva lO bjectList列表中各个 IntervalObject的计时器变量CountNum值递减1，当CountNum<0的时候，表示此数据集刷新 时间到了，即将数据集添加到Ajax请求队列请求数据集查询数据； 将CountNum<0的展现数据集，组装templateReq请求数据，并通过Ajax请求后台服 务数据查询接口，数据查询结果dataSources以JSON格式传输到客户端； 成功接收数据后，遍历所有接收的数据，根据展现数据集ID，将数据分别赋值给展 7 CN 111611518 A 说　明　书 4/11 页 现数据集的Data属性； 将数据集刷新频率对象的计时器变量Co u n t N u m复位为控件刷新频率 TimerInterval的值，继续循环计时 与现有技术相比，本发明的有益效果： 本发明提供的基于Html5的可视化发布展示技术，在利用设计器的图形界面上以 拖拽和属性栏配置的方式设计完画面后可直接发布成相应的Html5页面，期间无需另外开 发任何代码，实现了可视化设计器配置的页面能够在主流浏览器中展现，并可支持数据刷 新和页面交互操作，做到页面一处设计，多处展示，多类终端展示(大屏、桌面、移动终端 等)，有效的解决了可视化平台页面跨平台展示的问题，而且实现了利用可视化设计器来简 单快捷地配置出BS系统。 附图说明 为了使本发明的内容更容易被清楚地理解，下面根据具体实施例并结合附图，对 本发明作进一步详细的说明，其中： 图1为本发明一种实施例的Html5页面发布流程图； 图2为本发明一种实施例的Html5页面渲染展示流程图； 图3为本发明一种实施例的页面控件数据刷新流程图； 图4为本发明一种实施例的基于Html5的可视化展示页面自动发布系统的结构框 图。