CN112486378A - 图形生成方法、装置、终端及存储介质 - Google Patents

Abstract

本申请公开了一种图形生成方法、装置、终端及存储介质。图形生成方法包括：终端获取用户输入的绘图基本参数和绘图基本参数对应的目标实例化对象，目标实例化对象为目标web页面的实例化对象；终端根据绘图基本参数得到目标绘图配置参数，所述目标绘图配置参数为web可视化工具能够识别的配置参数；终端基于目标实例化对象的svg容器，根据目标绘图配置参数生成目标图形。如此，用户需要在web页面绘图时，可仅提供绘图基本参数，终端就可根据绘图基本参数得到web可视化工具能够识别的绘图配置参数，并生成目标图形。基于svg生成目标图形，可以在需要对已绘制的图形进行局部修改或者增加绘图元素时，仅对修改部分或增加部分进行局部渲染，提升图形生成效率。

Description

图形生成方法、装置、终端及存储介质

技术领域

本申请涉及web页面开发技术领域，尤其涉及了一种图形生成方法、装置、终端及存储介质。

背景技术

在大数据时代，大数据可视化的价值日益凸显，各个数据相互关联形成了图，在图关系上进行交互关联，追本溯源，成为安全分析人员迫切需要的一个功能。市面上已有类似于echarts/g6/d3等web可视化工具。echarts/g6/d3等web可视化工具可以供一个底层库，在上面开发者用户可以进行自定义开发，但是开发者用户需要提供echarts/g6/d3等web可视化工具能够识别的、完整的绘图配置参数，开发者用户在web页面绘图时，工作量较大，学习成本比较高。

发明内容

本申请实施例提供一种图形生成方法、装置、终端及存储介质。

第一方面，本申请实施例提供了一种图形生成方法，用于在目标web页面生成目标图形，所述图形生成方法包括：

终端获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象，所述目标实例化对象为所述目标web页面的实例化对象；

所述终端根据所述绘图基本参数得到目标绘图配置参数，所述目标绘图配置参数为web可视化工具能够识别的配置参数；

所述终端基于所述目标实例化对象的svg容器，利用web可视化工具根据所述目标绘图配置参数生成所述目标图形。

在某些实施例中，所述终端基于所述目标实例化对象的svg容器，利用web可视化工具根据所述目标绘图配置参数生成所述目标图形包括：

所述终端判断所述目标web页面是否存在与所述目标实例化对象对应的已绘制图形；

当所述目标web页面存在与所述目标实例化对象对应的已绘制图形时，所述终端基于所述目标实例化对象的svg容器，根据所述目标绘图配置参数修改所述已绘制图形，并利用所述web可视化工具生成所述目标图形。

在某些实施例中，所述终端基于所述目标实例化对象的svg容器，根据所述目标绘图配置参数修改所述已绘制图形，并利用所述web可视化工具生成所述目标图形，包括：

所述终端基于所述目标实例化对象的svg容器，在所述已绘制图形的基础上，利用所述web可视化工具渲染所述目标绘图配置参数得到所述目标图形。

在某些实施例中，所述在所述已绘制图形的基础上，利用所述web可视化工具渲染所述目标绘图配置参数得到所述目标图形包括：

当所述目标绘图配置参数包含与所述已绘制图形的第一元素对应的第一目标绘图配置参数时，所述终端根据所述第一目标绘图参数修改所述第一元素对应的第一绘图配置参数；

在所述已绘制图形的基础上，所述终端利用所述web可视化工具渲染修改后的第一绘图配置参数和所述目标绘图配置参数中除所述第一目标绘图配置参数之外的绘图配置参数，得到所述目标图形。

在某些实施例中，所述终端判断是否存在与所述目标实例化对象对应的已绘制图形包括：

所述终端判断所述目标web页面的配置文件中是否存在与所述目标实例化对象对应的目标绘制记录标识；

当存在所述目标绘制记录标识时，所述终端判定存在与所述目标实例化对象对应的已绘制图形。

在某些实施例中，所述终端基于所述目标实例化对象的svg容器，根据所述目标绘图配置参数对所述目标实例化对象对应的图形进行绘制，以生成所述目标图形，还包括：

当不存在与所述目标实例化对象对应的已绘制图形时，所述终端创建与所述目标示例化对象对应的svg容器；

所述终端基于所述svg容器，利用所述web可视化工具根据所述目标绘图配置参数绘制所述目标图形。

在某些实施例中，所述获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象包括：

所述终端利用目标绘图工具库获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象；

所述终端根据所述绘图基本参数得到目标绘图配置参数包括：

所述终端利用所述目标绘图工具库根据所述绘图基本参数得到目标绘图配置参数；

所述终端基于所述目标实例化对象的svg容器，利用所述web可视化工具根据所述目标绘图配置参数生成所述目标图形包括：

所述终端利用所述目标绘图工具库基于所述目标实例化对象的svg容器，利用所述web可视化工具根据所述目标绘图配置参数生成所述目标图形。

第二方面，本申请还提供一种图形生成装置，用于在目标web页面生成目标图形，所述图形生成装置包括：

基本参数获取模块，用于获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象，所述目标实例化对象为所述目标web页面的实例化对象；

配置参数获取模块，用于根据所述绘图基本参数得到目标绘图配置参数，所述目标绘图配置参数为web可视化工具能够识别的配置参数；

图形生成模块，用于基于所述目标实例化对象的svg容器，利用web可视化工具根据所述目标绘图配置参数生成所述目标图形。

第三方面，本申请还提供一种终端，包括处理器、存储器，以及一个或多个程序，所述一个或多个程序被存储在所述存储器中，并且被配置由所述处理器执行，所述程序包括用于执行上述任一实施例所述的方法中的步骤的指令。

第四方面，本申请还提供一种计算机可读存储介质，所述计算机可读存储介质存储有计算机程序，所述计算机程序包括程序指令，所述程序指令当被处理器执行时使所述处理器执行上述任一实施例的方法

本申请的技术方案中，终端获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象；终端根据所述绘图基本参数得到目标绘图配置参数；终端基于所述目标实例化对象的svg容器，利用web可视化工具根据所述目标绘图配置参数生成所述目标图形。这样，用户需要在web页面绘图时，用户可以仅提供绘图基本参数，终端就可以根据绘图基本参数得到web可视化工具能够识别的绘图配置参数，并根据绘图配置参数生成目标图形。而且，本申请中，是基于svg生成目标图形，这样可以在用户需要对已绘制的图形进行局部修改或者增加绘图元素时，仅对修改部分或增加部分进行局部渲染，而不需要整体重新渲染，简化图形生成过程，也能够提升图形生成效率。

附图说明

为了更清楚地说明本申请实施例或现有技术中的技术方案，下面将对实施例或现有技术描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本申请的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1为本申请实施例的终端的硬件结构示意图；

图2为本申请实施例的图形生成方法的流程示意图；

图3为本申请实施例的图形生成方法的的另一流程示意图；

图4为本申请实施例的举例涉及的已绘制图形的示意图；

图5为本申请实施例的举例涉及的目标图形的示意图；

图6为本申请实施例提供的生成力导向图的流程示意图；

图7为本申请实施例提供的生成树图的流程示意图；

图8为本申请实施例的图形生成装置的模块示意图。

具体实施方式

下面将结合本申请实施例中的附图，对本申请实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。

请参阅图1，图1本申请实施例提供的终端100的硬件结构示意图。终端100包括处理器101、存储器102，以及一个或多个程序，一个或多个程序被存储在存储器102中，并且被配置由处理器101执行，程序包括用以下任一实施例的处理方法的步骤的指令。终端100可以是例如可以是但不限于个人计算机(PC)、手机等。存储器102可以是高速RAM存储器，也可以是稳定的存储器(non-volatile memory)，例如磁盘存储器，存储器102可选的还可以是独立于前述处理器101的存储装置。终端100还可以包括输入输出接口103。输入输出接口103可选的可以包括标准的有线接口、无线接口(如WI-FI接口)。

请参阅图2，图2是本申请实施例提供的一种图形生成方法的流程示意图，该图形生成方法可由本申请实施例的终端或本申请实施例的终端或图形生成装置实现。本申请实施例的图形生成方法用于在目标web页面生成目标图形，这种方法可包括但不限于如下步骤：

S21、终端获取用户输入的绘图基本参数和绘图基本参数对应的目标实例化对象，目标实例化对象为目标web页面的实例化对象；

终端安装有浏览器，用户可通过浏览器打开目标web页面。当用户需要在目标web页面绘制目标图形时，可通过终端输入绘图基本参数和绘图基本参数对应的目标实例化对象。目标图形可以是线框图，线框图包括多个节点和连接节点的连接线，目标图形也可以只包含一个节点。绘图基本参数例如可包括节点文本内容和加点之间的连接关系。

用户在需要在目标web页面绘制目标图形时，需要先在该目标web页面创建一个目标实例化对象，对该实例化对象进行相应的初始化操作。也即，在步骤S21之前，终端可以先根据用户触发的实例化对象创建请求在目标web页面创建一个目标实例化对象。

S22、终端根据绘图基本参数得到目标绘图配置参数；

终端可以通过分析绘图基本参数得到目标绘图配置参数。目标绘图配置参数为web可视化工具能够识别的绘图配置参数，也即web可视化工具能够根据目标绘图配置参数生成相应的目标图形。绘图基本参数可理解为相比较于目标绘图配置参数更简单的绘图参数，例如绘图基本参数可包括点文本内容和加点之间的连接关系，终端可利用web可视化工具根据绘图基本参数得到目标绘图配置参数。本申请实施例中，web可视化工具为基于可缩放的矢量图形(svg)的web可视化工具。较佳地，web可视化工具为d3(Data—DrivenDocmument)。

该目标绘图配置参数可以是根据基本绘图参数和默认配置参数得到的，该基本配置参数包括节点内容和节点之间的链接关系，默认配置参数包括节点颜色、形、连接线参数等。用户需要设置节点的颜色、形状等参数时，可在输入的基本绘图参数中，提供节点的颜色、形状等参数。如果基本绘图参数与默认配置参数矛盾，则以基本绘图参数为准。

S23、终端基于目标实例化对象的svg容器，利用web可视化工具根据目标绘图配置参数生成目标图形。

svg容器可以是在步骤S23之前创建的，可以是在执行步骤S23，且没有目标实例化对象对应的svg容器时，终端创建与目标实例化对象对应的svg容器。例如，在本次绘制目标图形为针对该目标实例化对象的首次绘图时，终端创建一个svg容器，用于绘制目标图形；在本次绘制目标图形不是针对该目标实例化对象的首次绘图时，则说明之前针对该目标实例化对象的绘图时，已经创建好了svg容器，则执行步骤S23时，则不需要创建svg容器。

本申请的技术方案中，终端获取用户输入的绘图基本参数和绘图基本参数对应的目标实例化对象；终端根据绘图基本参数得到目标绘图配置参数；终端基于目标实例化对象的svg容器，根据目标绘图配置参数生成目标图形。这样，用户需要在web页面绘图时，用户可以仅提供绘图基本参数，终端就可以根据绘图基本参数得到web可视化工具能够识别的绘图配置参数，并根据绘图配置参数生成目标图形，便于用户操作，降低绘图的工作量。

而且，本申请中，是基于svg生成目标图形，这样可以当用户需要对已绘制的图形进行局部修改或者增加绘图元素时，仅对修改部分或增加部分进行局部渲染，而不需要整体重新渲染，简化图形生成过程，也能够提升图形生成效率。

本申请实施例中，上述步骤S21-步骤S23均可通过目标绘图工具库实现，该目标绘图工具库例如可以是一个JavaScript库。也即终端利用目标绘图工具库获取用户输入的绘图基本参数和绘图基本参数对应的目标实例化对象；终端利用目标绘图工具库根据绘图基本参数得到目标绘图配置参数；终端基于目标实例化对象的svg容器，利用web可视化工具根据目标绘图配置参数生成目标图形。这样，将步骤S21、S22和步骤S23的功能封装在该目标绘图工具库，当用户需要在目标web页面绘制目标图形时，可通过调用该目标绘图工具库，并提供绘图基本参数和目标实例化对象，即可实现在目标web页面绘制目标图形。在当前图形绘制过程为针对该目标实例化对象的首次绘制时，用户可先在目标web页面创建一个目标实例化对象，并根据该目标绘图工具库例对该目标实例化对象进行初始化配置，得到目标实例化对象之后，再调用该目标绘图工具库例，并提供目标实例化对象和绘图基本参数，终端即可利用该目标绘图基本工具库执行上述步骤S21-S23，在该目标web页面生成目标图形。这样用户可以更方便快捷地在目标web页面绘制目标图形，更加有效地降低在web页面绘图的工作量。当web可视化工具为d3时，可将本申请实施例的目标绘图工具库理解为基于d3的可视化绘图工具库。

在进一步地实施例中，还可以在目标图形中绑定点击事件，这样使得该目标图形为具备交互功能的图形。具体地，用户可以在基本绘图参数中提供点击事件及需要绑定的待绑定元素，这样终端可利用目标绘图工具实现将该点击事件与该待绑定元素绑定。

请参阅图3，基于上述实施例，在进一步的实施例中，步骤S23包括：

S231、终端判断目标web页面是否存在与目标实例化对象对应的已绘制图形；

判断目标web页面是否存在与目标实例化对象对应的已绘制图形，也就是判断本次绘制目标图形是否为针对目标实例化对象的首次绘制。当存在与目标实例化对象对应的已绘制图形时，则本次绘制目标图形不是针对目标实例化对象的首次绘制，当不存在与目标实例化对象对应的已绘制图形时，则本次绘制目标图形是针对目标实例化对象的首次绘制。

具体地，终端可通过判断目标web页面的配置文件中是否存在与目标实例化对象对应的目标绘制记录标识，来确定目标web页面是否存在与目标实例化对象对应的已绘制图形。当存在目标绘制记录标识时，终端判定存在与目标实例化对象对应的已绘制图形，当不存在与目标实例化对象对应的目标绘制记录标识时，判定不存在与目标实例化对象对应的已绘制图形。终端在针对目标实例化对象进行绘图时，在该web页面的配置文件中创建一个与该目标实例化对象对应的目标绘制记录标识，那么，只要存在与目标实例化对象对应的已绘制图形，则会存在对应的目标绘制记录标识，那么终端则可以根据是否存在目标绘制记录标识来判断是否与目标实例化对象对应的已绘制图形。

S232、当目标web页面存在与目标实例化对象对应的已绘制图形时，终端基于目标实例化对象的svg容器，利用web可视化工具根据目标绘图配置参数修改已绘制图形，以生成目标图形。

具体地，终端基于目标实例化对象的svg容器，在已绘制图形的基础上，利用web可视化工具渲染目标绘图配置参数得到目标图形。可以理解，当目标web页面存在与目标实例化对象对应的已绘制图形时，在该目标web页面的配置文件中，也包含有该已绘制图形对应的历史绘图配置参数，那么在已绘制图形的基础上，渲染目标绘图配置参数得到目标图形，也即终端仅渲染为本次绘制目标图形所获得的目标绘图配置参数，而不会一并渲染历史绘图配置参数和目标绘图配置参数。这种局部渲染的方式，可以更快速、更高效地生成目标图形。

进一步地，在已绘制图形的基础上，利用web可视化工具渲染目标绘图配置参数得到目标图形包括：当目标绘图配置参数包含与已绘制图形的第一元素对应的第一目标绘图配置参数时，在已绘制图形对应的历史绘图参数中，根据第一目标绘图参数修改第一元素对应的第一绘图配置参数；在已绘制图形的基础上，利用web可视化工具渲染修改后的第一绘图配置参数和目标绘图配置参数中除第一目标绘图配置参数之外的绘图配置参数，得到目标图形。

在一个例子中，已绘制图形如图4所示，已绘制图形包括多个节点元素和多个连接线元素，目标绘图配置参数中，包含指示已绘制图形的元素A的形状为正方形的第一目标绘图配置参数和在已绘制图形中增加连接与节点II连接的H节点的第二目标绘图配置参数，则终端在该已绘制图形对应的历史绘图配置参数中，根据第一目标绘图配置参数修改元素A的第一绘图配置参数，并在该已绘制图形对应的绘图配置参数中，加入第二目标绘图配置参数。在渲染时，对修改后的第一绘图配置参数及第二目标绘图配置参数进行渲染，得到如图5所示的目标图形。目标图形包括渲染目标绘图配置参数得到的图形(元素A、H和连接元素H和元素II的连接线元素)和已绘制图形中的除元素A之外的图形。

这样，当用户需要修改已绘制图形中的部分元素时，可只提供该部分素修改后的基本绘图参数，终端就可以根据该基本绘图配置参数对需要修改的部分元素对应的绘图配置参数进行修改，并进行局部渲染完成对部分元素的修改。

可以理解，该实例化对象对应的配置参数中的修改部分为本次绘图提供的目标绘图配置参数，也即是说，本申请实施例中，渲染绘图配置参数时，实际上是仅对该实例化对象对应的配置参数中的修改部分进行渲染。

S233、当不存在与目标实例化对象对应的已绘制图形时，终端创建与目标示例化对象对应的svg容器，并端基于该svg容器利用web可视化工具根据目标绘图配置参数绘制目标图形。

当不存在与目标示例化对象对应的已绘制图形时，则说明，本次绘图时针对该目标实例化对象的首次绘图，需要新创建一个与该目标实例化对象对应的svg容器，用于绘制目标图形。然后再基于该svg容器，利用web可视化工具对目标绘图配置参数进行渲染，得到目标图形。

如此，当存在与目标实例化对象对应的已绘制图形时，也即本次绘制目标图形不是针对目标实例化对象的首次绘制时，用户可仅提供本次绘图的修改部分的绘图基本参数，终端即可实现在已绘制图形的基础上根据绘图基本参数得到目标图形，而且终端渲染时，也只对修改部分的绘图配置参数进行渲染，这样可以更快速地生成目标图形。

本申请实施例还能够实现对已绘制图形中的单个元素进行修改，例如可改变节点的形状、节点的内容、节点的尺寸、颜色等，也能新增节点、删除节点，或修改节点之间的连接关系。当不存在与目标实例化对象对应的已绘制图形时，也即本次绘制目标图形是针对目标实例化对象的首次绘制时，终端则会新创建一个svg容器，并给予该svg容器对目标绘图配置参数进行渲染，得到目标图形，这样得到的目标图形是基于svg的，在后续需要对该目标图形进行修改时，也可以通过局部渲染的方式进行修改。

在渲染绘图配置参数时，需要基于图实例对象的图形类型渲染目标绘图配置参数，得到目标图形。例如当存在与目标实例化对象对应的已绘制图形时，则按照目标实例化对象对应的图示例对象的图形类型，渲染绘图配置参数。当不存在与目标实例化对象对应的已绘制图形时，则先判断该目标实例化对象是否已实例化图形类型，若没有实例化图形类型，则根据目标绘图配置参数，基于该目标实例化对象创建图实例对象，以实例化图形类型，并基于该图实例对象渲染目标绘图配置参数。

需要说明的是，上述步骤S231-步骤S233为步骤S23的细化步骤，在步骤S23可通过目标绘图工具库实现的基础上，步骤S231-步骤S233也可以通过目标绘图工具库实现。也即，终端可利用目标绘图工具库判断目标web页面是否存在与目标实例化对象对应的已绘制图形；当目标web页面存在与目标实例化对象对应的已绘制图形时，终端利用目标绘图工具库基于目标实例化对象的svg容器，根据目标绘图配置参数修改已绘制图形，以生成目标图形；当不存在与目标实例化对象对应的已绘制图形时，终端利用目标绘图工具库创建与目标示例化对象对应的svg容器，并且基于svg容器，根据目标绘图配置参数绘制目标图形。

图6为本申请实施例提供的生成力导向图的流程示意图。该生成力导向图的过程包括：终端利用目标绘图工具库根据用户输入的基本绘图参数得到目标绘图配置参数，终端利用目标绘图工具得到目标绘图配置参数的过程中，目标绘图工具库可将用户输入的基本绘图参数转化为web可视化工具能够识别的绘图配置参数，并结合默认配置参数，得到目标绘图配置参数，默认配置参数可包括默认框图类型、文本默认颜色等；终端利用目标绘图工具库根据用户输入的目标实例化对象判断是否为首次绘制；若为首次绘制，则目标绘图工具库创建与该目标实例化对象对应的svg容器，基于该svg容器创建力导向模拟器，在该力导向模拟器中绑定点击事件并添加辅助功能模块之后，进入图形渲染过程得到目标力导向图；若不是首次绘制，直接进入图形渲染过程；图形渲染过程包括：目标绘图工具库根据目标绘图参数针对该力导向模拟器渲染节点和边，然后绑定数据和DOM节点、并进行diff处理得到新添加或修改的节点选择器和边选择器，并更新节点和边的样式之后，启动力导向模拟器得到目标力导向图。其中，该图形渲染过程可以由目标绘图工具库调用web可视化工具d3实现。

图7为本申请实施例提供的生成树图的流程示意图。该生成树图的过程包括：终端利用目标绘图工具库根据用户于输入的基本绘图参数得到目标绘图配置参数，终端利用目标绘图工具得到目标绘图配置参数的过程中，目标绘图工具库可将用户输入的基本绘图参数转化为web可视化工具能够识别的绘图配置参数，并结合默认配置参数，得到目标绘图配置参数，默认配置参数可包括默认框图类型、文本默认颜色等；终端利用目标绘图工具库根据用户输入的目标实例化对象判断是否为首次绘制；若为首次绘制，则目标绘图工具库创建与该目标实例化对象对应的svg容器，基于该svg容器创建树图布局并确定主题样式之后，进入图形渲染过程得到目标树图；若不是首次绘制，直接进入图形渲染过程；图形渲染过程包括：目标绘图工具库根据目标绘图参数针对该树图布局渲染节点和边，然后绑定数据和DOM节点、并进行diff处理得到新添加或修改的节点选择器和边选择器，并更新的节点和边的样式得到目标树图。其中，该图形渲染过程可以由目标绘图工具库调用web可视化工具d3实现。

需要说明的是，上述生成力导向图过程和生成树图过程仅用于举例说明，本申请实施例的图形生成方法不限于用于生成力导向图和树图，也可以利用本申请实施例的图形生成方法生成其他类型的图。

本申请实施例还提供一种绘图工具库，该绘图工具库可以为JavaScript库。该绘图工具库可以作为上述实施例中的目标绘图工具库，绘图工具库用于：

获取用户输入的绘图基本参数和绘图基本参数对应的目标实例化对象，目标实例化对象为目标web页面的实例化对象；

根据绘图基本参数得到目标绘图配置参数；

基于目标实例化对象的svg容器，根据目标绘图配置参数生成目标图形。

如此，将上述实施例中生成目标图形的步骤封装在该绘图工具库，当用户需要在目标web页面绘制目标图形时，可通过调用该绘图工具库，并提供绘图基本参数和目标实例化对象，即可实现在目标web页面绘制目标图形。在当前图形绘制过程为针对该目标实例化对象的首次绘制时，用户可先在目标web页面创建一个目标实例化对象，并根据该绘图工具库例对该目标实例化对象进行初始化配置，得到目标实例化对象之后，再调用该绘图工具库例，并提供目标实例化对象和绘图基本参数，即可实现利用该目标绘图基本工具库在该目标web页面生成目标图形。这样用户可以更方便快捷地在目标web页面绘制目标图形，更加有效地降低在web页面绘图的工作量。

需要说明的是，上述实施例中对图形生成方法各步骤的解释说明也对应适用于本实施例的绘图工具库，为避免冗余，在此不再赘述。

请参阅图8，本申请实施例还提供一种图形生成装置800，用于在目标web页面生成目标图形，所述图形生成装置包括：

基本参数获取模块801，用于获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象，所述目标实例化对象为所述目标web页面的实例化对象；

配置参数获取模块802，用于根据所述绘图基本参数得到目标绘图配置参数，所述目标绘图配置参数为web可视化工具能够识别的配置参数；

图形生成模块803，用于基于所述目标实例化对象的svg容器，利用web可视化工具根据所述目标绘图配置参数生成所述目标图形。

在某些实施例中，图形生成模块包括：

判断单元，用于判断所述目标web页面是否存在与所述目标实例化对象对应的已绘制图形；

第一执行单元，用于当所述目标web页面存在与所述目标实例化对象对应的已绘制图形时，基于所述目标实例化对象的svg容器，根据所述目标绘图配置参数修改所述已绘制图形，并利用所述web可视化工具生成所述目标图形。

在某些实施例中，在所述基于所述目标实例化对象的svg容器，根据所述目标绘图配置参数修改所述已绘制图形，并利用所述web可视化工具生成所述目标图形方面，所述第一执行单元具体用于：

基于所述目标实例化对象的svg容器，在所述已绘制图形的基础上，利用所述web可视化工具渲染所述目标绘图配置参数得到所述目标图形。

在某些实施例中，所述在所述已绘制图形的基础上，利用所述web可视化工具渲染所述目标绘图配置参数得到所述目标图形方面，所述第一执行单元具体用于：

当所述目标绘图配置参数包含与所述已绘制图形的第一元素对应的第一目标绘图配置参数时，根据所述第一目标绘图参数修改所述第一元素对应的第一绘图配置参数；

在所述已绘制图形的基础上，利用所述web可视化工具渲染修改后的第一绘图配置参数和所述目标绘图配置参数中除所述第一目标绘图配置参数之外的绘图配置参数，得到所述目标图形。

在某些实施例中，所述判断单元具体用于：

判断所述目标web页面的配置文件中是否存在与所述目标实例化对象对应的目标绘制记录标识；

当存在所述目标绘制记录标识时，判定存在与所述目标实例化对象对应的已绘制图形。

在某些实施例中，图形生成模块还包括：

第二执行单元，用于在不存在与所述目标实例化对象对应的已绘制图形时，所述终端创建与所述目标示例化对象对应的svg容器；和基于所述svg容器，利用所述web可视化工具根据所述目标绘图配置参数绘制所述目标图形。

在某些实施例中，基本参数获取模块包括：

基本参数获取单元，用于利用目标绘图工具库获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象；

配置参数获取模块包括：

配置参数获取单元，用于利用所述目标绘图工具库根据所述绘图基本参数得到目标绘图配置参数；

图形生成模块包括：

图形生成单元，用于利用所述目标绘图工具库基于所述目标实例化对象的svg容器，利用所述web可视化工具根据所述目标绘图配置参数生成所述目标图形。

需要说明的是，上述实施例中对图形生成方法各步骤的补充说明及技术效果也适用于上述各实施例的图形生成装置，为避免冗余，在此不再赘述。

本申请还提供一种计算机可读存储介质，计算机可读存储介质上存储有图形生成程序，其中图形生成程序被处理器执行时，实现上述任一实施例的图形生成方法的步骤。

其中，图形生成程序被执行时所实现的方法及对应的技术效果可参照本申请图形生成方法的各个实施例，此处不再赘述。

在上述实施例中，可全部或部分地通过软件、硬件、固件、或其任意组合来实现。当使用软件实现时，可以全部或部分地以计算机程序产品的形式实现。所述计算机程序产品包括一个或多个计算机指令。在计算机上加载和执行所述计算机程序指令时，全部或部分地产生按照本申请实施例所述的流程或功能。所述计算机可以是通用计算机、专用计算机、计算机网络、或者其他可编程装置。所述计算机指令可以存储在计算机可读存储介质中，或者从一个计算机可读存储介质向另一个计算机可读存储介质传输，例如，所述计算机指令可以从一个网站站点、计算机、终端或数据中心通过有线(例如同轴电缆、光纤、数字用户线)或无线(例如红外、无线、微波等)方式向另一个网站站点、计算机、终端或数据中心进行传输。所述计算机可读存储介质可以是计算机能够存取的任何可用介质或者是包含一个或多个可用介质集成的终端、数据中心等数据存储设备。所述可用介质可以是磁性介质(例如软盘、硬盘、磁带)、光介质(例如光盘)、或者半导体介质(例如固态硬盘)等。

在上述实施例中，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其他实施例的相关描述。

在本申请所提供的几个实施例中，应该理解到，所揭露的装置，也可以通过其它的方式实现。例如以上所描述的装置实施例仅仅是示意性的，例如所述单元的划分，仅仅为一种逻辑功能划分，实际实现时可以有另外的划分方式，例如多个单元或组件可结合或者可以集成到另一个系统，或一些特征可以忽略或不执行。另一点，所显示或讨论的相互之间的间接耦合或者直接耦合或通信连接可以是通过一些接口，装置或单元的间接耦合或通信连接，可以是电性或其它的形式。

所述作为分离部件说明的单元可以是或者也可以不是物理上分开的，作为单元显示的部件可以是或者也可以不是物理单元，即可以位于一个地方，或者，也可以分布到多个网络单元上。可以根据实际的需要选择其中的部分或者全部单元来实现本实施例的方案的目的。

另外，在本申请各实施例中的各功能单元可集成在一个处理单元中，也可以是各单元单独物理存在，也可两个或两个以上单元集成在一个单元中。上述集成的单元既可以采用硬件的形式实现，或者也可以采用软件功能单元的形式实现。

所述集成的单元如果以软件功能单元的形式实现并作为独立的产品销售或使用时，可以存储在一个计算机可读取存储介质中。基于这样的理解，本申请技术方案本质上或者说对现有技术做出贡献的部分或者该技术方案的全部或部分可以以软件产品的形式体现出来，该计算机软件产品存储在一个存储介质中，包括若干指令用以使得一台计算机设备(可为个人计算机、终端或者网络设备等)执行本申请各个实施例所述方法的全部或部分步骤。而前述的存储介质例如可包括：U盘、移动硬盘、只读存储器(ROM，Read-OnlyMemory)、随机存取存储器(RAM，Random Access Memory)、磁碟或光盘等各种可存储程序代码的介质。

可以理解的是，凡是被控制或者被配置以用于执行本申请所描述的图形生成方法的产品，如上述图形生成装置、终端，均属于本申请所描述的相关产品的范畴。

Claims (10)

1.一种图形生成方法，用于在目标web页面生成目标图形，其特征在于，所述图形生成方法包括：

终端获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象，所述目标实例化对象为所述目标web页面的实例化对象；

所述终端根据所述绘图基本参数得到目标绘图配置参数，所述目标绘图配置参数为web可视化工具能够识别的配置参数；

所述终端基于所述目标实例化对象的svg容器，利用web可视化工具根据所述目标绘图配置参数生成所述目标图形。

2.根据权利要求1所述的图形生成方法，其特征在于，所述终端基于所述目标实例化对象的svg容器，利用web可视化工具根据所述目标绘图配置参数生成所述目标图形包括：

所述终端判断所述目标web页面是否存在与所述目标实例化对象对应的已绘制图形；

当所述目标web页面存在与所述目标实例化对象对应的已绘制图形时，所述终端基于所述目标实例化对象的svg容器，根据所述目标绘图配置参数修改所述已绘制图形，并利用所述web可视化工具生成所述目标图形。

3.根据权利要求2所述的图形生成方法，其特征在于，所述终端基于所述目标实例化对象的svg容器，根据所述目标绘图配置参数修改所述已绘制图形，并利用所述web可视化工具生成所述目标图形，包括：

所述终端基于所述目标实例化对象的svg容器，在所述已绘制图形的基础上，利用所述web可视化工具渲染所述目标绘图配置参数得到所述目标图形。

4.根据权利要求3所述的图形生成方法，其特征在于，所述在所述已绘制图形的基础上，利用所述web可视化工具渲染所述目标绘图配置参数得到所述目标图形包括：

当所述目标绘图配置参数包含与所述已绘制图形的第一元素对应的第一目标绘图配置参数时，所述终端根据所述第一目标绘图参数修改所述第一元素对应的第一绘图配置参数；

在所述已绘制图形的基础上，所述终端利用所述web可视化工具渲染修改后的第一绘图配置参数和所述目标绘图配置参数中除所述第一目标绘图配置参数之外的绘图配置参数，得到所述目标图形。

5.根据权利要求2-4任一项所述的图形生成方法，其特征在于，所述终端判断是否存在与所述目标实例化对象对应的已绘制图形包括：

所述终端判断所述目标web页面的配置文件中是否存在与所述目标实例化对象对应的目标绘制记录标识；

当存在所述目标绘制记录标识时，所述终端判定存在与所述目标实例化对象对应的已绘制图形。

6.根据权利要求1-4任一项所述的图形生成方法，其特征在于，所述终端基于所述目标实例化对象的svg容器，根据所述目标绘图配置参数对所述目标实例化对象对应的图形进行绘制，以生成所述目标图形，还包括：

当不存在与所述目标实例化对象对应的已绘制图形时，所述终端创建与所述目标示例化对象对应的svg容器；

所述终端基于所述svg容器，利用所述web可视化工具根据所述目标绘图配置参数绘制所述目标图形。

7.根据权利要求1所述的图形生成方法，其特征在于，所述获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象包括：

所述终端利用目标绘图工具库获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象；

所述终端根据所述绘图基本参数得到目标绘图配置参数包括：

所述终端利用所述目标绘图工具库根据所述绘图基本参数得到目标绘图配置参数；

所述终端基于所述目标实例化对象的svg容器，利用所述web可视化工具根据所述目标绘图配置参数生成所述目标图形包括：

所述终端利用所述目标绘图工具库基于所述目标实例化对象的svg容器，利用所述web可视化工具根据所述目标绘图配置参数生成所述目标图形。

8.一种图形生成装置，用于在目标web页面生成目标图形，其特征在于，所述图形生成装置包括：

基本参数获取模块，用于获取用户输入的绘图基本参数和所述绘图基本参数对应的目标实例化对象，所述目标实例化对象为所述目标web页面的实例化对象；

配置参数获取模块，用于根据所述绘图基本参数得到目标绘图配置参数，所述目标绘图配置参数为web可视化工具能够识别的配置参数；

图形生成模块，用于基于所述目标实例化对象的svg容器，利用web可视化工具根据所述目标绘图配置参数生成所述目标图形。

9.一种终端，其特征在于，包括处理器、存储器，以及一个或多个程序，所述一个或多个程序被存储在所述存储器中，并且被配置由所述处理器执行，所述程序包括用于执行如权利要求1-7任一项所述的方法中的步骤的指令。

10.一种计算机可读存储介质，其特征在于，所述计算机可读存储介质存储有计算机程序，所述计算机程序包括程序指令，所述程序指令当被处理器执行时使所述处理器执行如权利要求1-7任一项所述的方法。

Images