【技术实现步骤摘要】
本申请涉及计算机，具体涉及一种用于构建页面的可视化组件编辑方法、系统、设备及介质。
技术介绍
1、随着互联网的发展和数字化转型的加速，智慧城市的概念逐渐成为现实。在这一背景下，城市的运营与管理方式正在发生深刻变革，其中数据可视化页面作为智慧城市的窗口，扮演着将庞大数据集成、实时展示和快速决策支持的重要角色。
2、目前，传统数据可视化页面的创建方法通常依赖于操作人员编写大量代码来实现数据的集成和可视化。但是在实际应用中，由于城市数据量的快速增长，往往需要操作人员具备复杂的编程能力，整个数据可视化页面的创建过程繁琐，耗费时间长，从而导致构建数据可视化页面的效率较低。
技术实现思路
1、本申请提供了一种用于构建页面的可视化组件编辑方法、系统、设备及介质，具有提高数据可视化页面构建效率的效果。
2、第一方面，本申请提供了一种用于构建页面的可视化组件编辑方法，包括：
3、获取目标区域的场景构建信息，所述场景构建信息包括静态场景信息；
4、创建初始画布页面，并根据所述静态场景信息，生成所述初始画布页面中的多个图层，各所述图层中包括原可视化组件，所述原可视化组件设有可编辑范围；
5、响应于操作人员的编辑操作，在所述可编辑范围内调整各所述图层中的所述原可视化组件，生成各所述图层中的目标可视化组件；
6、将包含所述目标可视化组件的所述初始画布页面作为可视化页面输出至数据大屏。
7、通过采用上述技术方案，获取目标区域的
8、可选的，获取所述数据大屏中可视窗口的尺寸和分辨率；根据所述可视窗口的所述尺寸和所述分辨率，生成所述初始画布页面。
9、通过采用上述技术方案， 获取数据大屏中用来展示可视化内容的可视窗口的尺寸和分辨率参数，以及根据获取到的可视窗口的参数来生成尺寸和分辨率与可视窗口完全匹配的初始画布页面，从而使得后续在该画布页面中添加和编辑的可视化组件，能够精确匹配数据大屏的显示效果和分辨率，避免了组件展示和布局与大屏显示不符的情况，提高了组件在画布页面中的展示质量。通过获取可视窗口参数并据此生成匹配的参数化初始画布页面，为后续的可视化组件布局和内容展示提供了精确匹配的数据大屏显示效果的空间坐标和控制，增强了可视化组件的展示适配性，使输出的可视化页面可以无差错地在数据大屏中呈现，提高了系统的可视化呈现质量。
10、可选的，根据所述城市地图信息，创建所述第一图层，并将所述第一图层设置于所述初始画布页面中的预设底层位置；根据所述交通流量信息，创建所述第二图层，并将所述第二图层设置于所述初始画布页面中的预设覆盖层位置；根据所述环境监测信息，创建所述第三图层，并将所述第三图层设置于所述初始画布页面中的预设顶层位置。
11、通过采用上述技术方案，在画布页面中，根据不同类型的静态场景信息，分别创建对应的图层，并预设各图层的层级关系，实现了画布页面多图层的级别化设计。底层的地图图层起到场景信息的基础背景作用；流量图层覆盖在地图层之上，表示交通流量信息；顶层的监测图层覆盖在流量层之上，表示环境监测信息。多图层的级别化设置，构建了页面视觉效果的层次结构和逻辑关系，使不同类型的场景信息可视化组件具有清晰、合理的展示布局。该方案通过对画布页面多图层的预设化设计，增强了可视化组件布局的逻辑性，使可视化页面的视觉效果更具层次性和关联性。
12、可选的，根据预设可视化组件库，分别匹配所述城市地图信息、所述交通流量信息以及所述环境监测信息对应的所述原可视化组件；根据所述第一图层位置、所述第二图层位置、所述第三图层位置以及各所述图层中所述原可视化组件的组件位置，分别匹配各所述图层中所述原可视化组件的所述可编辑位置范围；确定各所述原可视化组件的组件类型，根据所述组件类型和所述初始画布页面的页面尺寸，分别匹配各所述图层中所述原可视化组件的所述可编辑尺寸范围。
13、通过采用上述技术方案，预设统一的可视化组件库，实现了不同类型场景信息与对应的可视化组件的快速匹配获取，提高了组件获取的标准化和效率。根据组件和图层的位置参数，以及画布页面的尺寸参数，分别配置了各层中原可视化组件的可编辑的位置范围和尺寸范围，实现了对组件位置移动和尺寸缩放的合理约束，既保证了组件编辑的灵活性，又规避了组件越界问题。该方案通过匹配组件库、配置可编辑范围，实现了原可视化组件参数化配置的自动化，增强了组件的标准化生成和智能适配性，有利于后续生成可视化页面的质量和效率。
14、可选的，获取所述组件拖动、所述组件缩放、所述组件颜色设置以及所述组件字体比例设置对应的编辑指令；根据所述编辑指令，调整各所述图层中所述原可视化组件，得到各可视化组件；若各所述可视化组件的组件位置未超出所述可编辑位置范围，且各所述可视化组件的组件尺寸未超出所述可编辑尺寸范围，则将各所述可视化组件作为各所述图层中的所述目标可视化组件。
15、通过采用上述技术方案，获取交互式编辑操作所对应的指令参数，并根据这些参数化的编辑指令，自动执行对原可视化组件的位置、大小、样式等参数的调整，实现了人机交互式编辑过程的自动化执行。设置组件参数调整后的校验机制，只有当组件的位置和尺寸都在预设的可编辑范围内时，才将编辑后的组件输出为目标组件，从而保证了组件编辑过程的合规性。该方案通过参数化的编辑指令和结果校验，实现了交互式编辑的过程自动化，既提高了编辑效率，也保证了编辑结果的正确性，有效支持了快速生成用户自定义的可视化组件。
16、可选的，根据预设api，调用所述动态场景信息对应的配置数据；根据各所述图层中的所述目标可视化组件的组件名称，绑定所述配置数据，得到各所述图层中的目标组件；根据各所述目标组件和所述初始画布页面，生成可视化文件，并将所述可视化文件同步至所述数据大屏，生成所述可视化页面。
17、通过采用上述技术方案，调用预设的api获取动态场景的配置数据，建立起组件与动态场景数据的对应关系。配置数据的绑定为组件关联上实时的数据源，支持后续的动态可视化表达。然后通过将包含目标组件的画布页面，按本文档来自技高网...
【技术保护点】
1.一种用于构建页面的可视化组件编辑方法，其特征在于，包括：
2.根据权利要求1所述的用于构建页面的可视化组件编辑方法，其特征在于，所述创建初始画布页面，包括：
3.根据权利要求1所述的用于构建页面的可视化组件编辑方法，其特征在于，所述场景布局信息包括城市地图信息、交通流量信息以及环境监测信息，所述图层包括第一图层、第二图层以及第三图层，所述根据所述静态场景信息，生成所述初始画布页面中的多个图层，包括：
4.根据权利要求3所述的用于构建页面的可视化组件编辑方法，其特征在于，所述可编辑范围包括可编辑位置范围和可编辑尺寸范围，所述根据所述静态场景信息，生成所述初始画布页面中的多个图层，还包括：
5.根据权利要求4所述的用于构建页面的可视化组件编辑方法，其特征在于，所述编辑操作包括组件拖动、组件缩放、组件颜色设置以及组件字体比例设置，所述响应于操作人员的编辑操作，在所述可编辑范围内调整各所述图层中的所述原可视化组件，生成各所述图层中的目标可视化组件，包括：
6.根据权利要求1所述的用于构建页面的可视化组件编辑方法，其特征在于，
7.根据权利要求1所述的用于构建页面的可视化组件编辑方法，其特征在于，所述将包含所述目标可视化组件的所述初始画布页面作为可视化页面输出至数据大屏之后，还包括：
8.一种用于构建页面的可视化组件编辑系统，其特征在于，所述系统包括：
9.一种电子设备，其特征在于，包括处理器、存储器、用户接口及网络接口，所述存储器用于存储指令，所述用户接口和所述网络接口用于给其他设备通信，所述处理器用于执行所述存储器中存储的指令，以使所述电子设备执行如权利要求1-7任意一项所述的一种用于构建页面的可视化组件编辑方法。
10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有指令，当所述指令被执行时，执行如权利要求1-7任意一项所述的一种用于构建页面的可视化组件编辑方法步骤。
...【技术特征摘要】
1.一种用于构建页面的可视化组件编辑方法，其特征在于，包括：
2.根据权利要求1所述的用于构建页面的可视化组件编辑方法，其特征在于，所述创建初始画布页面，包括：
3.根据权利要求1所述的用于构建页面的可视化组件编辑方法，其特征在于，所述场景布局信息包括城市地图信息、交通流量信息以及环境监测信息，所述图层包括第一图层、第二图层以及第三图层，所述根据所述静态场景信息，生成所述初始画布页面中的多个图层，包括：
4.根据权利要求3所述的用于构建页面的可视化组件编辑方法，其特征在于，所述可编辑范围包括可编辑位置范围和可编辑尺寸范围，所述根据所述静态场景信息，生成所述初始画布页面中的多个图层，还包括：
5.根据权利要求4所述的用于构建页面的可视化组件编辑方法，其特征在于，所述编辑操作包括组件拖动、组件缩放、组件颜色设置以及组件字体比例设置，所述响应于操作人员的编辑操作，在所述可编辑范围内调整各所述图层中的所述原可视化组件，生成各所述图层中的目标可视化组件，包括：
...【专利技术属性】
技术研发人员：魏俊浩，
申请(专利权)人：广州巨隆科技有限公司，
类型：发明
国别省市：
还没有人留言评论。发表了对其他浏览者有用的留言会获得科技券。