一种快速构建可视化大屏布局模板的方法及系统技术方案

本发明专利技术是关于一种快速构建可视化大屏布局模板的方法及系统，该方法包括：将待构建的可视化大屏的布局模板进行区域划分，得到多个不同位置的区域；对待构建的可视化大屏的布局模板进行整体属性配置和整体布局方式配置；对每个位置的区域配置多种功能组件以完成功能配置；将布局模板进行渲染；采用预设布局方式将渲染后的可视化大屏的布局模板进行展示。本发明专利技术通过对可视化大屏布局模板进行区域划分，使各区域既可以进行整体上的统一配置，也可以各自独立进行配置，使得配置方式更加多样化；通过对模板进行多功能组件的配置，使各区域具备多种功能，可调用多种功能进行图像显示，展示效果好。开发代码复用性高，一次开发就可满足多种场景的使用。足多种场景的使用。足多种场景的使用。

【技术实现步骤摘要】
一种快速构建可视化大屏布局模板的方法及系统


[0001]本公开实施例涉及数据处理
，尤其涉及一种快速构建可视化大屏布局模板的方法及系统。

技术介绍

[0002]可视化大屏是通过电子信息系统将信息、画面等内容体现在荧幕上的一种展示过程。它可以将企业的各类数据如销售额、生产进度、运行数据以及运营效率等，以画面、图表、视频、数据的方式展示在屏幕上，使开发运维人员或者管理人员可以直观获取到项目运行情况。并且，可视化大屏也经常被用于展示公司的运营数据、客户服务信息以及品牌效应等宣传活动，为发展企业的品牌形象和客户满意度带来便利。可视化大屏还通常应用于公司内部的运营数据和管理过程，以及展示在公司人员较为密集的区域，例如公司展厅等等。它的优点包括信息展示比较直观、传输效率高，进而可以促进高效决策等，是现代企业管理和决策的重要媒介之一。
[0003]在实际开发应用中，可视化大屏的开发需要进行很多方面的配置和调整，例如画面布局、图表的大量使用、展示效果的编写以及与服务器的数据传输和获取的接口编写等。当前已有的大屏开发方式代码复用性较低，若改变布局还需重新编写页面，造成开发效率较低和展示效果较差的问题，同时将伴随着较高的开发成本。
[0004]因此，有必要改善上述相关技术方案中存在的一个或者多个问题。
[0005]需要注意的是，本部分旨在为权利要求书中陈述的本公开的技术方案提供背景或上下文。此处的描述不因为包括在本部分中就承认是现有技术。

技术实现思路

[0006]本公开实施例的目的在于提供一种快速构建可视化大屏布局模板的方法及系统，进而至少在一定程度上克服由于相关技术的限制和缺陷而导致的一个或者多个问题。
[0007]本公开实施例首先提供一种快速构建可视化大屏布局模板的方法，包括：
[0008]将待构建的可视化大屏的布局模板进行区域划分，得到多个不同位置的区域；
[0009]对待构建的可视化大屏的布局模板进行整体属性配置和整体布局方式配置；
[0010]对每个位置的区域配置多种功能组件以完成功能配置；
[0011]将所述布局模板进行渲染；
[0012]采用预设布局方式将渲染后的可视化大屏的布局模板进行展示。
[0013]本公开的一实施例中，多个不同位置的区域包括标题栏、左侧区域、右侧区域和中间区域。
[0014]本公开的一实施例中，对待构建的可视化大屏的布局模板进行整体属性配置的步骤包括：
[0015]对待构建的可视化大屏的布局模板的大小、页面缩放方式、背景缩略图以及标题样式进行配置。
[0016]本公开的一实施例中，对待构建的可视化大屏的布局模板进行整体布局方式配置的步骤包括：
[0017]根据可视化大屏的分辨率预设多种整体布局方式，其中布局方式包括自适应布局和固定布局，所述自适应布局用于将所述可视化大屏的预设区域设置成自适应模式，所述固定布局用于将所述可视化大屏以左中右、左右或左中中右模式进行显示。
[0018]本公开的一实施例中，对多个不同位置的区域中的至少两个区域设定关联关系。
[0019]本公开的一实施例中，多种功能组件包括图表组件和自定义组件。
[0020]本公开的一实施例中，所述采用预设布局方式将渲染后的可视化大屏布局模板进行展示的步骤包括：
[0021]采用拖拽方式将预设布局方式和预设展示效果赋予模板内容后进行展示。
[0022]本公开的一实施例中，每个所述区域中包括至少一个模块，检测或识别每个区域中各模块对应的展示内容，以判定所述展示内容在同一区域中是否合成。
[0023]本公开实施例还提供一种快速构建可视化大屏布局模板的系统，所述系统包括：
[0024]区域划分模块，用于将待构建的可视化大屏的布局模板进行区域划分，得到多个不同位置的区域；
[0025]整体配置模块，用于对待构建的可视化大屏的布局模板进行整体属性配置和整体布局方式配置；
[0026]功能配置模块，用于对每个位置的区域配置多种功能组件以完成功能配置；
[0027]渲染模块，用于将所述布局模板进行渲染；
[0028]展示模块，用于采用预设布局方式将渲染后的可视化大屏的布局模板进行展示。
[0029]本公开的一实施例中，多个不同位置的区域包括标题栏、左侧区域、右侧区域和中间区域。
[0030]本公开的实施例提供的技术方案可以包括以下有益效果：
[0031]本公开实施例中的一种快速构建可视化大屏布局模板的方法及系统，通过对待构建的可视化大屏的布局模板进行区域划分，使各区域既可以进行整体上的统一配置，也可以各自独立进行专门的配置，使得配置方式更加灵活、多样化；通过对模板进行多功能组件的配置，使各区域具备多种功能，可以调用多种功能进行图像显示，展示效果好。本申请的方法开发代码复用性高，一次开发就可满足多种场景的使用。
附图说明
[0032]此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理。显而易见地，下面描述中的附图仅仅是本公开的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
[0033]图1示出本公开一个示例性实施例中快速构建可视化大屏布局模板的方法的流程示意图；
[0034]图2示出本公开示例性实施例中模板布局的区域划分示意图；
[0035]图3示出本公开示例性实施例中区域的模块划分示意图；
[0036]图4示出本公开示例性实施例中将可视化大屏的布局模板进行渲染的过程图；
[0037]图5示出本公开示例性实施例中的草稿区的结构划分示意图；
[0038]图6示出本公开示例性实施例中对多个不同位置的区域中的至少两个区域设定关联关系的流程图；
[0039]图7示出本公开示例性实施例中检测或识别区域中各模块对应的展示内容的流程图；
[0040]图8示出本公开示例性实施例中快速构建可视化大屏的布局模板的系统的模块结构图；
[0041]图9示出本公开示例性实施例中一种电子设备的结构示意图；
[0042]图10示出本公开示例性实施例中用于实现快速构建可视化大屏布局模板的方法的程序产品的结构示意图。
具体实施方式
[0043]现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本公开将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。
[0044]此外，附图仅为本公开实施例的示意性图解，并非一定是按比例绘制。图中相同的附图标记表示相同或类似的部分，因而将省略对它们的重复描述。附图中所示的一些方框图是功能实体，不一定必须与物理或逻辑上独立的实体相对应。
本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种快速构建可视化大屏布局模板的方法，其特征在于，包括：将待构建的可视化大屏的布局模板进行区域划分，得到多个不同位置的区域；对待构建的可视化大屏的布局模板进行整体属性配置和整体布局方式配置；对每个位置的区域配置多种功能组件以完成功能配置；将所述布局模板进行渲染；采用预设布局方式将渲染后的可视化大屏的布局模板进行展示。2.根据权利要求1所述快速构建可视化大屏布局模板的方法，其特征在于，多个不同位置的区域包括标题栏、左侧区域、右侧区域和中间区域。3.根据权利要求1所述快速构建可视化大屏布局模板的方法，其特征在于，对待构建的可视化大屏的布局模板进行整体属性配置的步骤包括：对待构建的可视化大屏的布局模板的大小、页面缩放方式、背景缩略图以及标题样式进行配置。4.根据权利要求1所述快速构建可视化大屏布局模板的方法，其特征在于，对待构建的可视化大屏的布局模板进行整体布局方式配置的步骤包括：根据可视化大屏的分辨率预设多种整体布局方式，其中布局方式包括自适应布局和固定布局，所述自适应布局用于将可视化大屏的预设区域设置成自适应模式，所述固定布局用于将所述可视化大屏以左中右、左右或左中中右模式进行显示。5.根据权利要求1所述快速构建可视化大屏布局模板的方法，其特征在于，对多个不同位置...

【专利技术属性】
技术研发人员：刘林，龚浩杰，王若楠，请求不公布姓名，
申请(专利权)人：苔花科迈西安信息技术有限公司，
类型：发明
国别省市：