基于数据结构体回显的高复用性大屏可视化配置方法与流程

1.本发明涉及计算机应用技术领域，具体为基于数据结构体回显的高复用性大屏可视化配置方法。


背景技术：

2.随着全社会数字化进程的加速发展，对大数据的统计和展示要求也在日益提高，小到公司报表展示，大到城市运行统计分析，在大屏幕中展现大数据的需求越来越多，面对与日俱增的大屏数据展示需求，有一套快速搭建，快速布局，快速应用的大屏配置系统显得尤为重要。
3.现有大屏项目开发需要投入大量的前后端开发人员，开发周期过长，并且开发出来的项目定制化程度高，可复用程度低，市面上的同类产品配置过程过于繁琐，不易上手，不能很好的解决非编程人员可直接上手生成可用于生产的大屏展示页面的痛点。


技术实现要素：

4.（一）解决的技术问题针对现有技术的不足，本发明提供了基于数据结构体回显的高复用性大屏可视化配置方法，解决了现有技术重在数据源的配置，面向普通用户，存在不易上手的痛点且项目可复用程度低的问题。
5.（二）技术方案为实现以上目的，本发明通过以下技术方案予以实现：基于数据结构体回显的高复用性大屏可视化配置方法，包括以下步骤：步骤一、开启软件进入配置选择模式，选择快速布局或进行自定义布局；步骤二、选择快速布局模式后对尺寸进行选择，尺寸比例选择32:9或16:9，比例选择完成后确认布局类型为左右布局或u型布局；步骤三、配置选择模式为自定义布局后根据需要输入屏幕分辨率以生成画布，画布生成后定义栅格系统：对列数、行高、最大行数、栅格中元素边距进行依次确定，最后选中栅格元素并定义元素属性；步骤四、选择装饰与文字颜色后根据需要拖拽调整各组件位置，生成拖拽组件库；步骤五、保存调配好的拖拽配置并生成一套记录整体布局方式的数据结构体文件。
6.优选的，所述步骤三中定义元素属性具体为：拖拽元素判断其是否为静态，并依次对栅格元素的最小高度、最大宽度和最大高度进行确定。
7.优选的，所述步骤四中拖拽组件库具体为：拖拽背景图与拖拽子组件。
8.优选的，所述拖拽子组件包括：饼图、柱形图、折线图、雷达图和气泡图。
9.优选的，所述步骤五中保存拖拽配置时需要将生成的数据结构体文件上传到数据库进行保存。
10.优选的，所述步骤一中快速布局模式可适用于非编程人员进行快速配置。
11.优选的，所述数据结构体文件中记录所使用到的组件的每一个参数信息，能够通过直接修改json字段进行布局位置及大小的修改。
12.优选的，拖拽组件库与拖拽配置分别为两个独立的项目，可单独部署，他们之间通过qiankun微服务框架进行通信。
13.（三）有益效果本发明提供了基于数据结构体回显的高复用性大屏可视化配置方法。具备以下有益效果：1、本发明通过将组件库项目、大屏拖拽配置项目整合成一个整体使用，其中大屏拖拽项目开发完成之后不需要再改动，组件库项目可不断扩展维护，以增加组件库的丰富性，同时保证业务之间的低耦合，可有效提高项目的稳定性。
14.2、本发明通过整个配置过程简单可视，不涉及任何专业性知识，对非编程人员友好简便，另外针对需要快速微调局部的使用场景，可直接修改配置文件进行微调，能适用于应急演练。
15.3、本发明通过简单配置及拖拽快速生成大屏可视化页面，同时，每个组件基于栅格化系统，可随意调整大小并保证组件自适应不变形，相同组件仅需要开发一次，用户可无限次使用，减少了重复性工作，降低了开发成本。
附图说明
16.图1为本发明的使用流程示意图。
具体实施方式
17.下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本发明保护的范围。
18.实施例一：如图1所示，本发明实施例提供基于数据结构体回显的高复用性大屏可视化配置方法，包括以下步骤：步骤一、开启软件进入配置选择模式，选择快速布局或进行自定义布局；步骤二、选择快速布局模式后对尺寸进行选择，尺寸比例选择16:9，比例选择完成后确认布局类型为左右布局或u型布局；步骤三、配置选择模式为自定义布局后根据需要输入屏幕分辨率以生成画布，画布生成后定义栅格系统：对列数、行高、最大行数、栅格中元素边距进行依次确定，最后选中栅格元素并定义元素属性；步骤四、选择装饰与文字颜色后根据需要拖拽调整各组件位置，生成拖拽组件库；步骤五、保存调配好的拖拽配置并生成一套记录整体布局方式的数据结构体文件。
19.通过简单配置及拖拽快速生成大屏可视化页面，同时，每个组件基于栅格化系统，
可随意调整大小并保证组件自适应不变形，相同组件仅需要开发一次，用户可无限次使用，减少了重复性工作，降低了开发成本。
20.步骤三中定义元素属性具体为：拖拽元素判断其是否为静态，并依次对栅格元素的最小高度、最大宽度和最大高度进行确定。
21.步骤四中拖拽组件库具体为：拖拽背景图与拖拽子组件。
22.拖拽子组件包括：饼图、柱形图、折线图、雷达图和气泡图。
23.步骤五中保存拖拽配置时需要将生成的数据结构体文件（josn文件）上传到数据库进行保存。
24.当需要展示大屏可视化页面时通过读取配置生成的数据结构体文件进行回显，从而达到所配即所得的，无需编辑代码的大屏展示页面。
25.步骤一中快速布局模式可适用于非编程人员进行快速配置。
26.快速布局模式可快速选定自身所需的布局并对其进行配置，即使是非编程人员也能够快速配置。
27.数据结构体文件中记录所使用到的组件的每一个参数信息，能够通过直接修改json字段进行布局位置及大小的修改。
28.拖拽组件库与拖拽配置分别为两个独立的项目，可单独部署，他们之间通过qiankun微服务框架进行通信。
29.避免扩充组件库的时候影响到拖拽配置项目，这样一能保障拖拽项目一次开发之后一劳永逸，无需再动，二能保障开发组件库时无需顾及其他，瞻前顾后，从而提高开发效率。综上所述，此种模式可以完美解决多个不同团队之间协同开发沟通成本高，组件库与拖拽配置耦合度高，整体开发效率低的问题。
30.实施例二：如图1所示，本发明实施例提供基于数据结构体回显的高复用性大屏可视化配置方法，包括以下步骤：步骤一、开启软件进入配置选择模式，选择快速布局或进行自定义布局；步骤二、选择快速布局模式后对尺寸进行选择，尺寸比例选择32:9或16:9，比例选择完成后确认布局类型为左右布局或u型布局；步骤三、配置选择模式为自定义布局后根据需要输入屏幕分辨率以生成画布，画布生成后定义栅格系统：对列数、行高、最大行数、栅格中元素边距进行依次确定，最后选中栅格元素并定义元素属性；步骤四、选择装饰与文字颜色后根据需要拖拽调整各组件位置，生成拖拽组件库；步骤五、保存调配好的拖拽配置并生成一套记录整体布局方式的数据结构体文件。
31.通过简单配置及拖拽快速生成大屏可视化页面，同时，每个组件基于栅格化系统，可随意调整大小并保证组件自适应不变形，相同组件仅需要开发一次，用户可无限次使用，减少了重复性工作，降低了开发成本。
32.步骤三中定义元素属性具体为：拖拽元素判断其是否为静态，并依次对栅格元素的最小高度、最大宽度和最大高度进行确定。
33.步骤四中拖拽组件库具体为：拖拽背景图与拖拽子组件。
34.拖拽子组件包括：饼图、柱形图、折线图、雷达图和气泡图。
35.步骤五中保存拖拽配置时需要将生成的数据结构体文件（josn文件）上传到数据库进行保存。
36.当需要展示大屏可视化页面时通过读取配置生成的数据结构体文件（josn文件）进行回显，从而达到所配即所得的，无需编辑代码的大屏展示页面。
37.步骤一中快速布局模式可适用于非编程人员进行快速配置。
38.快速布局模式可快速选定自身所需的布局并对其进行配置，即使是非编程人员也能够快速配置。
39.数据结构体文件中记录所使用到的组件的每一个参数信息，能够通过直接修改json字段进行布局位置及大小的修改。
40.拖拽组件库与拖拽配置分别为两个独立的项目，可单独部署，他们之间通过qiankun微服务框架进行通信。
41.避免扩充组件库的时候影响到拖拽配置项目，这样一能保障拖拽项目一次开发之后一劳永逸，无需再动，二能保障开发组件库时无需顾及其他，瞻前顾后，从而提高开发效率。综上所述，此种模式可以完美解决多个不同团队之间协同开发沟通成本高，组件库与拖拽配置耦合度高，整体开发效率低的问题。
42.尽管已经示出和描述了本发明的实施例，对于本领域的普通技术人员而言，可以理解在不脱离本发明的原理和精神的情况下可以对这些实施例进行多种变化、修改、替换和变型，本发明的范围由所附权利要求及其等同物限定。