一种可视化看板的创建方法、装置、电子设备和存储介质制造方法及图纸

本发明专利技术公开了一种可视化看板的创建方法、装置、电子设备和存储介质，包括：获取空白看板；根据配置指令对空白看板进行图层切换、布局设计、容器编辑和图表编辑，以获得配置信息，其中，通过容器编辑建立容器之间的关联关系；根据配置信息对空白看板进行渲染，以创建可视化看板。根据配置指令对空白看板进行图层切换、布局设计、容器编辑和图表编辑获得的配置信息，直接根据所获取的配置信息实现可视化看板的创建，而无需进行大量的代码操作，并且在容器编辑过程中能够建立容器之间的关联关系，从而能够实现容器关联交互的复杂场景，满足了用户可视化看板的创建需求。

【技术实现步骤摘要】
一种可视化看板的创建方法、装置、电子设备和存储介质
本专利技术实施例涉及数据处理处理
，尤其涉及一种可视化看板的创建方法、装置、电子设备和存储介质。
技术介绍
在各领域的软件系统或平台中，通常需要可视化看板直观地展示核心数据和关键指标。目前在采用Vue框架创建可视化看板时，通常是基于原生JavaScript或jQuery的看板页面，通过Vue框架拆分为组件化的开发方式，并且是通过拖拽等交互配置的方式实现对常见图表的简单布局。但是现有技术中在基于Vue框架实现可视化看板创建的过程中，通常需要大量的编码工作，并且在通过拖拽等交互配置的方式仅能实现简单布局，而无法满足容器交互等复杂场景的需求，因此现有的可视化看板的创建方式并不能满足用户的需求。
技术实现思路
本专利技术实施例提供了一种可视化看板的创建方法、装置、电子设备和存储介质，以实现对可视化看板的创建。第一方面，本专利技术实施例提供了一种可视化看板的创建方法，包括：获取空白看板；根据配置指令对空白看板进行图层切换、布局设计、容器编辑和图表编辑，以获得配置信息，其中，通过容器编辑建立容器之间的关联关系；根据配置信息对空白看板进行渲染，以创建可视化看板。第二方面，本专利技术实施例提供了一种可视化看板的创建装置，包括：空白看板获取模块，用于获取空白看板；配置信息获取模块，用于根据配置指令对空白看板进行图层切换、布局设计、容器编辑和图表编辑，以获得配置信息；可视化看板创建模块，用于根据配置信息对空白看板进行渲染，以创建可视化看板。第三方面，本专利技术实施例还提供了一种电子设备，电子设备包括：一个或多个处理器；存储装置，用于存储一个或多个程序；当一个或多个程序被一个或多个处理器执行，使得一个或多个处理器实现本专利技术任意实施例的方法。第四方面，本专利技术实施例还提供了一种计算机可读存储介质，其上存储有计算机程序，该程序被处理器执行时实现本专利技术任意实施例的方法。在本专利技术实施例中，根据配置指令对空白看板进行图层切换、布局设计、容器编辑和图表编辑获得的配置信息，直接根据所获取的配置信息实现可视化看板的创建，而无需进行大量的代码操作，并且在容器编辑过程中能够建立容器之间的关联关系，从而能够实现容器关联交互的复杂场景，满足了用户可视化看板的创建需求。附图说明图1是本专利技术实施例一提供的可视化看板的创建方法的流程图；图2是本专利技术实施例二提供的可视化看板的创建方法的流程图；图3是本专利技术实施例三提供的可视化看板的创建装置结构示意图；图4是本专利技术实施例四提供的一种电子设备的结构框图。具体实施方式下面结合附图和实施例对本专利技术作进一步的详细说明。可以理解的是，此处所描述的具体实施例仅仅用于解释本专利技术，而非对本专利技术的限定。另外还需要说明的是，为了便于描述，附图中仅示出了与本专利技术相关的部分而非全部结构。实施例一图1是本专利技术实施例提供的可视化看板的创建方法的流程图，本实施例可适用于对客户化看板进行创建的情况，该方法可以由本专利技术实施例中的可视化看板的创建装置来执行，该装置可以通过软件和/或硬件的方式实现，本专利技术实施例的方法具体包括如下步骤：步骤S101，获取空白看板。可选的，获取空白看板之前还包括：获取看板创建指令，其中，看板创建指令中包含看板标识；判断是否存在与看板标识所对应的已有可视化看板，若是，则直接从本地获取配置信息，并根据配置信息对已有可视化看板进行渲染展示，否则，生成空白看板获取指令，以根据空白看板获取指令获取空白看板。具体的说，本实施方式中可以基于Vue、React或Angular等前端开发框架进行可视化看板的创建过程。在获取到看板创建指令后，会提取看板创建指令中所包含的看板标识，并根据看板标识判断是否存在与看板标识所对应的已有可视化看板。在确定不存在与看板标识所对应的可视化看板的情况下，则直接生成空白看板获取指令，并根据空白看板获取指令新建空白看板，所创建的空白看板是创建可视化看板的基础，此时在空白看板中并不包含其它有效信息。需要说明的是，在确定存在与看板标识所对应的可视化看板的情况下，则直接从本地获取已经保存的配置信息，并根据配置信息对已有可视化看板进行渲染展示。步骤S102，根据配置指令对空白看板进行图层切换、布局设计、容器编辑和图表编辑，以获得配置信息。可选的，根据配置指令对空白看板进行图层切换、布局设计、容器编辑和图表编辑，以获得配置信息，包括：根据配置指令进行图表编辑将数据库中的数据转换成指定类型的图表以获得图表信息；根据配置指令进行容器编辑建立容器之间的关联关系以获得容器信息，其中，每个容器中至少包含一个图表；根据配置指令进行布局设计确定每个容器在空白看板的拖拽位置，以获得布局信息；根据配置指令进行图层切换选择要配置的图层类型以获得图层信息，其中，图层类型包括基础图层和浮动图层；根据图表信息、容器信息、布局信息和图层信息获得配置信息。具体的说，在获取到空白看板后，会根据用户所输入的配置指令对空白看板进行配置交互，以获取与空白看板所对应的配置信息。并且本实施方式中的配置交互包括图表编辑、容器编辑、布局设计和图层切换。在根据配置指令进行图表编辑时，将选定的数据库中的数据转换成指定类型的图表以获得图表信息，其中，指定类型的图表可以是柱形图、折线图、饼图或Excel表格，当然，本实施方式中仅是举例说明，而并不对指定类型的图表具体形式进行限定。由于选定数据库的数量可以包括多个，因此在图表信息中具体可以包含多个图表，例如，图表信息中包含：由数据库1通过转换所获得的柱形图1、由数据库2通过转换所获得的饼图1、由数据库3通过转换所获得的表格1，以及由数据库4通过转换所获得的表格2。其中，在进行容器编辑时，主要是根据编辑指令确定每个容器中所包含的具体图表，以及建立容器之间的关联关系。由于每个容器中至少包含一个图表，因此在建立容器之间的关联关系时，具体是建立不同容器中图表之间的关联关系，即联动关系。例如，将柱形图1和表格1放置在容器1中，将表格2放置在容器2中，建立容器1和容器2的联动关系，具体可以是建立表格1和表格2的联动关系，即将表格1作为表格2的筛选条件。从而在容器信息中包含每个容器中所包含的图表、不同容器之间的关联关系，其中，关联关系具体包含不同容器所包含的图表之间的联动关系。其中，在进行布局设计时，主要是根据编辑指令确定每个容器在空白看板的拖拽位置，即在布局信息中包含每个容器在空白看板的具体位置。并且本实施方式中所支持的布局方式具体包括：网格布局和绝对布局等，其中，网格布局是先将展示区域划分为若干格子，再往其中填充内容；而绝对布局是相对于展示区域左上角对各组件进行定位。在进行图层切换时，主要是根据编辑指令选择要配置的图层类型，图层类型包含基础图层和浮动图层，针对每一个类型的图层，可以分别执行上述的布局设计、容器编辑和图表编辑。并且不同图层的容器位置可相对固定本文档来自技高网...

【技术保护点】
1.一种可视化看板的创建方法，其特征在于，包括：/n获取空白看板；/n根据配置指令对所述空白看板进行图层切换、布局设计、容器编辑和图表编辑，以获得配置信息，其中，通过容器编辑建立容器之间的关联关系；/n根据所述配置信息对所述空白看板进行渲染，以创建可视化看板。/n

【技术特征摘要】
1.一种可视化看板的创建方法，其特征在于，包括：
获取空白看板；
根据配置指令对所述空白看板进行图层切换、布局设计、容器编辑和图表编辑，以获得配置信息，其中，通过容器编辑建立容器之间的关联关系；
根据所述配置信息对所述空白看板进行渲染，以创建可视化看板。


2.根据权利要求1所述的方法，其特征在于，所述获得配置信息之后，还包括：
将所述配置信息在本地进行保存。


3.根据权利要求2所述的方法，其特征在于，所述获取空白看板之前还包括：
获取看板创建指令，其中，所述看板创建指令中包含看板标识；
判断是否存在与所述看板标识所对应的已有可视化看板，若是，则直接从本地获取所述配置信息，并根据所述配置信息对所述已有可视化看板进行渲染展示，
否则，生成空白看板获取指令，以根据所述空白看板获取指令获取所述空白看板。


4.根据权利要求1所述的方法，其特征在于，所述根据配置指令对所述空白看板进行图层切换、布局设计、容器编辑和图表编辑，以获得配置信息，包括：
根据配置指令进行图表编辑将数据库中的数据转换成指定类型的图表以获得图表信息；
根据配置指令进行容器编辑建立容器之间的关联关系以获得容器信息，其中，每个容器中至少包含一个图表；
根据配置指令进行布局设计确定每个容器在所述空白看板的拖拽位置，以获得布局信息；
根据配置指令进行图层切换选择要配置的图层类型以获得图层信息，其中，所述图层类型包括基础图层和浮动图层；
根据所述图表信息、所述容器信息、所述布局信息和所述图层信息获得所述配置信息。


5.根据权利要求4所述的方法，其特征在于，所述方法还包括：
根据配置指令进行组件配置确定每个组件在所述空白看板的拖拽位置，以获得组件信息。


6.根据权利要求5所述的方法，其特征在于，所述根据所述配置信息对所述空白看板进行渲染，以创建可视化看板，包括：
对所述图层信息进行解析，根据图层信息解析结果对所述空白看板进行图层渲染；
对所述布局信息进行解析，根据布局信息解析结果对所述空白看板进行布局渲染；
对所述容器信息进行解析，根据容器信息解析结果对所述空白看板进行容器渲染；
对所述图表信息进行解析，根据图表信息解析结果对所述空白看板进行图表渲染；
对所述组件信息进行解析，根据组件信息解析结果对所述空白看板进行组件渲染；
根据所述空白看板的图层渲染结果、布局渲染结果、容器渲染结果、图表渲染结果和组件渲染结果创建所述可...

【专利技术属性】
技术研发人员：柴睿，陈辛，张铭超，许伟，蔡雪，史安明，侯立冬，孟宝权，王杰，杨满智，蔡琳，梁彧，田野，傅强，金红，陈晓光，
申请(专利权)人：恒安嘉新北京科技股份公司，
类型：发明
国别省市：北京;11