矢量图的绘制方法、装置及计算机可读存储介质制造方法及图纸

本发明专利技术公开了一种矢量图的绘制方法。所述矢量图的绘制方法包括：将目标矢量图模型输入到矢量图编辑器；通过所述矢量图编辑器根据用户选定的矢量图和目标矢量图模型绘制目标矢量图；根据预设的矢量图规则对绘制好的目标矢量图进行绑定。本发明专利技术中，通过预设将绘制好的矢量图绑定注入规则，便于将矢量图导出使用，有助于后期在网页端动态加载矢量图。同时，本发明专利技术还提供一种矢量图的绘制装置和一种计算机可读存储介质。

Drawing method, device and computer readable storage medium of vector graph

【技术实现步骤摘要】
矢量图的绘制方法、装置及计算机可读存储介质
本专利技术涉及矢量图的绘制技术，更具体地，涉及一种矢量图的绘制方法、装置及计算机可读存储介质。
技术介绍
随着技术的不断发展，在网页web端上绘图的需求愈加广泛。如，电力设备行业的设备拓扑图在网页端实现控制是非常繁琐且较为复杂。为解决这类问题，当前采用的是HTML5、JavaScript、SVG编辑器等配合使用来解决，常见的是基于js库迭代开发，建立专属的组件库。而这存在领域范围上的弊端，取决于业务的使用范畴、上下文场景，还取决于当前浏览器缓存、浏览器版本号、不同浏览器内置是否支持。
技术实现思路
为解决上述至少一个方面的问题，本专利技术提出了一种矢量图的绘制方法、装置及一种计算机可读存储介质，通过预设将绘制好的矢量图绑定注入规则，有助于后期在网页端动态加载矢量图，处理了传统SVG矢量图在传统网页上动态加载标志位置的数据问题。为了实现本专利技术的目的，采取如下技术方案:第一方面，本专利技术提供了一种矢量图的绘制方法。所述矢量图的绘制方法包括：将目标矢量图模型输入到矢量图编辑器；通过所述矢量图编辑器根据用户选定的矢量图和目标矢量图模型绘制目标矢量图；根据预设的矢量图规则对绘制好的目标矢量图进行绑定。具体地，所述将目标矢量图模型输入到矢量图编辑器之前，还包括：利用AI软件绘制所述目标矢量图模型。具体地，所述将目标矢量图模型输入到矢量图编辑器之前，还包括：在矢量图编辑器中写入具有预设规则的按钮和窗口。进一步地，所述根据预设的矢量图规则对绘制好的目标矢量图进行绑定的步骤中,具体包括：通过所述按钮和窗口，对所述绘制好的目标矢量图绑定预设的矢量图规则。进一步地，所述根据预设的矢量图规则对绘制好的目标矢量图进行绑定之后，还包括：预先在web端建立好DIV；利用所述DIV承装经绑定的目标矢量图。进一步地，所述利用所述DIV承装经绑定的目标矢量图之后，还包括：将目标矢量图的全部元素写入到所述DIV；根据所述矢量图规则，遍历所述全部元素的属性值，将所获取到的属性值截取拆分，并根据截取拆分后的属性值完成对所述目标矢量图的图形操作或数据的绑定。进一步地，所述根据截取拆分后的属性值完成对所述目标矢量图的图形操作或数据的绑定的步骤中，具体包括：通过循环预设的条件语句去判断截取拆分后的属性值的标志值和标志位；根据所述标志值和标志位完成对所述目标矢量图的图形操作或数据的绑定。具体地，根据预设的矢量图规则对绘制好的目标矢量图进行绑定之后，还包括：部署应用服务器ApacheTomcat容器。第二方面，本专利技术提供了一种矢量图的绘制装置。输入模块，用于将目标矢量图模型输入到矢量图编辑器；绘制模块，用于根据用户选定的矢量图和目标矢量图模型绘制目标矢量图；绑定模块，用于根据预设的矢量图规则对绘制好的目标矢量图进行绑定。第三方面，本专利技术提供了一种计算机可读存储介质。所述计算机可读存储介质上存储有计算机程序，所述计算机程序被处理器执行时实现第一方面任一项所述的矢量图的绘制方法。相比现有技术，本专利技术的方案具有以下优点：本专利技术中，将目标矢量图模型输入到矢量图编辑器；根据用户选定的矢量图和目标矢量图模型绘制目标矢量图；根据预设的矢量图规则对绘制好的目标矢量图进行绑定。本专利技术通过预设将绘制好的矢量图绑定注入规则，便于将矢量图导出使用，有助于后期在网页端动态加载矢量图，处理了传统SVG矢量图在传统网页上动态加载标志位置的数据问题，可以根据自己定义的规则，能够简单轻便的解决实际操作在SVG元素内容的问题，有效区别于当前软件研发界内构造组态软件的大量繁琐配置和组态工程需要大量的庞大工作量。本专利技术附加的方面和优点将在下面的描述中部分给出，这些将从下面的描述中变得明显，或通过本专利技术的实践了解到。附图说明为了更清楚地说明本专利技术实施例中的技术方案，下面将对实施例描述中所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本专利技术的一些实施例，对于本领域技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。图1示出了本专利技术中一种矢量图的绘制方法的一种实施例的步骤流程；图2示出了本专利技术中一种矢量图的绘制装置的一种实施例的装置结构。具体实施方式为了使本
的人员更好地理解本专利技术方案，下面将结合本专利技术实施例中的附图，对本专利技术实施例中的技术方案进行清楚、完整地描述。在本专利技术的说明书和权利要求书及上述附图中的描述的一些流程中，包含了按照特定顺序出现的多个操作，但是应该清楚了解，这些操作可以不按照其在本文中出现的顺序来执行或并行执行，操作的序号如101、102等，仅仅是用于区分开各个不同的操作，序号本身不代表任何的执行顺序。另外，这些流程可以包括更多或更少的操作，并且这些操作可以按顺序执行或并行执行。需要说明的是，本文中的“第一”、“第二”等描述，是用于区分不同的消息、设备、模块等，不代表先后顺序，也不限定“第一”和“第二”是不同的类型。下面将结合本专利技术实施例中的附图，对本专利技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本专利技术一部分实施例，而不是全部的实施例。基于本专利技术中的实施例，本领域技术人员在没有作出创造性劳动前提下所获得的所有其他实施例，都属于本专利技术保护的范围。第一方面，本专利技术提供一种矢量图的绘制方法。如图1，示出了本专利技术中一种矢量图的绘制方法的步骤流程。所述矢量图的绘制方法包括步骤S101、步骤S102、步骤S103。其中：步骤S101.将目标矢量图模型输入到矢量图编辑器；本专利技术中，选定目标矢量图模型，例如SVG矢量图模型，输入到矢量图编辑器中。当输入的目标矢量图模型为SVG矢量图模型，所述矢量图编辑器优选为SVG编辑器。步骤S102.通过所述矢量图编辑器根据用户选定的矢量图和目标矢量图模型绘制目标矢量图；利用所述矢量图编辑器，用户可以选定一些矢量图结构，通过将所述矢量图结构和目标矢量模型组合调整，以输出用户所需的目标矢量图。步骤S103.根据预设的矢量图规则对绘制好的目标矢量图进行绑定。本专利技术中，在矢量图编辑器(如SVG编辑器)中编码写入具有一定规则的按钮和窗口，对已经做好的矢量目标图进行绑定注入规则，所述注入的规则为用户根据实际的需求自定义的规则，用于约定所述矢量目标图的一些元素的属性值等。可以理解的是，所述注入规则即本专利技术中的预设的矢量图规则。所述绘制矢量图，包括通过一些矢量图和矢量图模型构造矢量图。本专利技术通过预设将绘制好的矢量图绑定注入规则，便于将矢量图导出使用，有助于后期在网页端动态加载矢量图，处理了传统矢量图(如SVG矢量图)在传统网页上动态加载标志位置的数据问题，可以根据自己定义的规则，能够简单轻便本文档来自技高网...

【技术保护点】
1.一种矢量图的绘制方法，其特征在于，包括：/n将目标矢量图模型输入到矢量图编辑器；/n通过所述矢量图编辑器根据用户选定的矢量图和目标矢量图模型绘制目标矢量图；/n根据预设的矢量图规则对绘制好的目标矢量图进行绑定。/n

【技术特征摘要】
1.一种矢量图的绘制方法，其特征在于，包括：
将目标矢量图模型输入到矢量图编辑器；
通过所述矢量图编辑器根据用户选定的矢量图和目标矢量图模型绘制目标矢量图；
根据预设的矢量图规则对绘制好的目标矢量图进行绑定。


2.根据权利要求1所述的矢量图的绘制方法，其特征在于，所述将目标矢量图模型输入到矢量图编辑器之前，还包括：
利用AI软件绘制所述目标矢量图模型。


3.根据权利要求1所述的矢量图的绘制方法，其特征在于，所述将目标矢量图模型输入到矢量图编辑器之前，还包括：
在矢量图编辑器中写入具有预设规则的按钮和窗口。


4.根据权利要求3所述的矢量图的绘制方法，其特征在于，所述根据预设的矢量图规则对绘制好的目标矢量图进行绑定的步骤中,具体包括：
通过所述按钮和窗口，对所述绘制好的目标矢量图绑定预设的矢量图规则。


5.根据权利要求1所述的矢量图的绘制方法，其特征在于，所述根据预设的矢量图规则对绘制好的目标矢量图进行绑定之后，还包括：
预先在web端建立好DIV；
利用所述DIV承装经绑定的目标矢量图。


6.根据权利要求5所述的矢量图的绘制方法，其特征在于，所述利用所述DIV承装经绑定的目标矢量图之后，还包括：

【专利技术属性】
技术研发人员：郑民毫，陈润辉，李春林，
申请(专利权)人：广州长川科技有限公司，
类型：发明
国别省市：广东;44