一种基于web画板的图形绘制方法、装置、设备及存储介质制造方法及图纸

本申请实施例公开了一种基于web画板的图形绘制方法、装置、设备及存储介质。该方法包括：确定被选中的图形绘制工具，并获取检测到的绘制行为数据，调用图形绘制工具将绘制行为数据转换为对应的图形数据；调用图形数据对应的图形绘制工具生成图形数据对应的图形显示信息，并根据图形显示信息在画板上进行渲染显示；确定被选中的图形扩展工具，并获取检测到的扩展行为数据，调用图形扩展工具将扩展行为数据转换为对应的扩展目标和扩展参数；调用图形扩展工具根据扩展参数更新扩展目标对应的图形数据，并调用该图形数据对应的图形绘制工具生成更新后的图形数据对应的图形显示信息，根据图形显示信息在画板上进行渲染显示。根据图形显示信息在画板上进行渲染显示。根据图形显示信息在画板上进行渲染显示。

【技术实现步骤摘要】
一种基于web画板的图形绘制方法、装置、设备及存储介质


[0001]本申请实施例涉及web图形绘制
，尤其涉及一种基于web画板的图形绘制方法、装置、设备及存储介质。

技术介绍

[0002]传统的web白板是一个可以提供用户进行绘画的画板，其中提供了各类图形工具以帮助用户绘画。传统的web白板是基于一个开源图形绘制库进行开发，图形绘制库主要是通过结合图形库以及用户在画板上的行为，计算并绘制图形到画板上。其中，图形绘制库提供一个内置的基础图形库，如果基础图形库不能满足项目开发需求，则需要基于基础图形库进行开发和创建更多的图形，例如开发椭圆图形，但是基础图形库并没有内置该基础图形，则基于基础图形中的圆图形来开发椭圆图形。
[0003]专利技术人在基于现有的web白板进行绘图使用时发现，其提供的图形扩展功能并不足以满足各种项目开发需求，尤其在某些特定场景下存在需要开发一种毫无规则的图形，如果仅基于已有的基础图形库进行开发，并不能实现绘制任意图形。

技术实现思路

[0004]本申请实施例提供一种基于web画板的图形绘制方法、装置、设备及存储介质，能够解决现有web画板无法绘制任意图形的问题。
[0005]在第一方面，本申请实施例提供了一种基于web画板的图形绘制方法，包括：
[0006]确定被选中的图形绘制工具，并获取检测到的绘制行为数据，调用所述图形绘制工具将所述绘制行为数据转换为对应的图形数据；
[0007]调用所述图形数据对应的图形绘制工具生成所述图形数据对应的图形显示信息，并根据所述图形显示信息在画板上进行渲染显示；
[0008]确定被选中的图形扩展工具，并获取检测到的扩展行为数据，调用所述图形扩展工具将所述扩展行为数据转换为对应的扩展目标和扩展参数；
[0009]调用所述图形扩展工具根据所述扩展参数更新所述扩展目标对应的图形数据，并调用该图形数据对应的图形绘制工具生成更新后的图形数据对应的图形显示信息，根据所述图形显示信息在画板上进行渲染显示。
[0010]在第二方面，本申请实施例提供了一种基于web画板的图形绘制装置，包括：
[0011]第一行为数据获取模块，被配置为确定被选中的图形绘制工具，并获取检测到的绘制行为数据，调用所述图形绘制工具将所述绘制行为数据转换为对应的图形数据；
[0012]第一图形绘制模块，被配置为调用所述图形数据对应的图形绘制工具生成所述图形数据对应的图形显示信息，并根据所述图形显示信息在画板上进行渲染显示；
[0013]第二行为数据获取模块，被配置为确定被选中的图形扩展工具，并获取检测到的扩展行为数据，调用所述图形扩展工具将所述扩展行为数据转换为对应的扩展目标和扩展参数；
[0014]第二图形绘制模块，被配置为调用所述图形扩展工具根据所述扩展参数更新所述扩展目标对应的图形数据，并调用该图形数据对应的图形绘制工具生成更新后的图形数据对应的图形显示信息，根据所述图形显示信息在画板上进行渲染显示。
[0015]在第三方面，本申请实施例提供了一种电子设备，包括：
[0016]存储器以及一个或多个处理器；
[0017]所述存储器，用于存储一个或多个程序；
[0018]当所述一个或多个程序被所述一个或多个处理器执行，使得所述一个或多个处理器实现如第一方面所述的图形绘制方法。
[0019]在第四方面，本申请实施例提供了一种包含计算机可执行指令的存储介质，所述计算机可执行指令在由计算机处理器执行时用于执行如第一方面所述的图形绘制方法。
[0020]本申请实施例通过确定被选中的图形绘制工具，并获取检测到的绘制行为数据，调用图形绘制工具将绘制行为数据转换为对应的图形数据；调用图形数据对应的图形绘制工具生成图形数据对应的图形显示信息，并根据图形显示信息在画板上进行渲染显示；确定被选中的图形扩展工具，并获取检测到的扩展行为数据，调用图形扩展工具将扩展行为数据转换为对应的扩展目标和扩展参数；调用图形扩展工具根据扩展参数更新扩展目标对应的图形数据，并调用该图形数据对应的图形绘制工具生成更新后的图形数据对应的图形显示信息，根据图形显示信息在画板上进行渲染显示。通过上述技术手段，通过图形绘制工具，实现图形的任意绘制，通过图形扩展工具，实现对画板上已有图形的任意扩展，通过这两种类型的图形工具可以满足大部分特殊图形的创建和交互。
附图说明
[0021]图1是本申请实施例一提供的一种基于web画板的图形绘制方法的流程图；
[0022]图2为本专利技术实施例一提供的第一显示示意图；
[0023]图3是图形数据的一种可选的具体生成流程图；
[0024]图4是图形数据的一种可选的具体渲染流程图；
[0025]图5为本专利技术实施例一提供的第二显示示意图；
[0026]图6是扩展行为数据的一种可选的具体转换流程图；
[0027]图7为本专利技术实施例一提供的第三显示示意图；
[0028]图8是图形数据的一种可选的具体更新和渲染流程图；
[0029]图9为本专利技术实施例一提供的第四显示示意图；
[0030]图10是本申请实施例二提供的一种基于web画板的图形绘制方法的流程图；
[0031]图11为本专利技术实施例二提供的第一显示示意图；
[0032]图12是本申请实施例三提供的一种基于web画板的图形绘制装置的结构示意图；
[0033]图13是本申请实施例四提供的一种电子设备的结构示意图。
具体实施方式
[0034]为了使本申请的目的、技术方案和优点更加清楚，下面结合附图对本申请具体实施例作进一步的详细描述。可以理解的是，此处所描述的具体实施例仅仅用于解释本申请，而非对本申请的限定。另外还需要说明的是，为了便于描述，附图中仅示出了与本申请相关
的部分而非全部内容。在更加详细地讨论示例性实施例之前应当提到的是，一些示例性实施例被描述成作为流程图描绘的处理或方法。虽然流程图将各项操作(或步骤)描述成顺序的处理，但是其中的许多操作可以被并行地、并发地或者同时实施。此外，各项操作的顺序可以被重新安排。当其操作完成时所述处理可以被终止，但是还可以具有未包括在附图中的附加步骤。所述处理可以对应于方法、函数、规程、子例程、子程序等等。
[0035]本申请提供的基于web画板的图形绘制、装置、设备及存储介质，旨在确定被选中的图形绘制工具，并获取检测到的绘制行为数据，调用图形绘制工具将绘制行为数据转换为对应的图形数据；调用图形数据对应的图形绘制工具生成图形数据对应的图形显示信息，并根据图形显示信息在画板上进行渲染显示；确定被选中的图形扩展工具，并获取检测到的扩展行为数据，调用图形扩展工具将扩展行为数据转换为对应的扩展目标和扩展参数；调用图形扩展工具根据扩展参数更新扩展目标对应的图形数据，并调用该图形数据对应的图形绘制工具生成更新后的图形数据对应的图形显示信息，根据图形显示信息在画板上进行渲染显示。相对于传统的w本文档来自技高网...

【技术保护点】

【技术特征摘要】
1.一种基于web画板的图形绘制方法，其特征在于，包括：确定被选中的图形绘制工具，并获取检测到的绘制行为数据，调用所述图形绘制工具将所述绘制行为数据转换为对应的图形数据；调用所述图形数据对应的图形绘制工具生成所述图形数据对应的图形显示信息，并根据所述图形显示信息在画板上进行渲染显示；确定被选中的图形扩展工具，并获取检测到的扩展行为数据，调用所述图形扩展工具将所述扩展行为数据转换为对应的扩展目标和扩展参数；调用所述图形扩展工具根据所述扩展参数更新所述扩展目标对应的图形数据，并调用该图形数据对应的图形绘制工具生成更新后的图形数据对应的图形显示信息，根据所述图形显示信息在画板上进行渲染显示。2.根据权利要求1所述的方法，其特征在于，所述图形绘制工具和所述图形扩展工具配置在图形工具包中，所述图形工具包包括多种图形绘制工具和图形扩展工具。3.根据权利要求1所述的方法，其特征在于，所述图形绘制工具包括第一行为引擎；对应的，所述确定被选中的图形绘制工具，并获取检测到的绘制行为数据，调用所述图形绘制工具将所述绘制行为数据转换为对应的图形数据的步骤包括：确定被选中的图形绘制工具，并获取所述图形绘制工具对应的第一行为引擎；获取被检测到的绘制行为数据，所述绘制行为数据包括检测到的触摸位置、触摸时间、触摸面积和触摸路径中的一个或多个；调用所述第一行为引擎将所述绘制行为数据转换成图形数据，所述第一行为引擎为将绘制行为数据转换成图形数据的功能接口，所述图形数据包括图形尺寸、颜色、位置和层级中的一个或多个。4.根据权利要求3所述的方法，其特征在于，所述图形绘制工具还包括图形渲染器；对应的，所述调用所述图形数据对应的图形绘制工具生成所述图形数据对应的图形显示信息，并根据所述图形显示信息在画板上进行渲染显示的步骤包括：在预设的时间节点，根据所述图形数据确定生成所述图形数据的图形绘制工具，并获取所述图形绘制工具对应的图形渲染器；调用所述图形渲染器将所述图形数据渲染成对应的图形显示信息，并将所述图形显示信息显示在画板上，所述图形渲染器为将图形数据渲染成图形显示信息的功能接口。5.根据权利要求3所述的方法，其特征在于，所述图形扩展工具包括第二行为引擎；对应的，所述确定被选中的图形扩展工具，并获取检测到的扩展行为数据，调用所述图形扩展工具将所述扩展行为数据转换为对应的扩展目标和扩展参数的步骤包括：确定被选中的图形扩展工具，并获取所述图形扩展工具对应的第二行为引擎；获取被检测到的扩展行为数据，所述扩展行为数据包括检测到的触摸位置和触摸路径；调用所述第二行为引擎将所述扩展行为数据转换成扩展目标和扩展参数，所述第二行为引擎为将扩展行为数据转换成扩展目标和扩展参数的功能接口，所述扩展目标为目标选中框，所述扩展目标对应的图形数据为位于目标选中框内的图形显示信息对应的图形数据。6.根据权利要求4所述的方法，其特征在于，所述图形扩展工具还包括图形操作器；
对应的，所述调用所述图形扩展工具根据所述扩展参数更新所述扩展目标对应的图形数据，并调用该图形数据对应的图形绘制工具生成更新后的图形数据对应的图形显示信息，根据所述...

【专利技术属性】
技术研发人员：周泽润，
申请(专利权)人：广州视臻信息科技有限公司，
类型：发明
国别省市：