CN110782504A

CN110782504A - 曲线确定方法、装置、计算机可读存储介质及设备

Info

Publication number: CN110782504A
Application number: CN201910872400.4A
Authority: CN
Inventors: 杨健
Original assignee: Tencent Technology Shenzhen Co Ltd
Current assignee: Tencent Technology Shenzhen Co Ltd
Priority date: 2019-09-16
Filing date: 2019-09-16
Publication date: 2020-02-11

Abstract

本公开提供一种曲线确定方法、曲线确定装置、计算机可读存储介质及电子设备；涉及计算机技术领域。该方法包括：确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点；根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽；根据第一线宽、第二线宽、第一中点和第二中点确定待连接点；根据待连接点绘制四边形并根据四边形确定待输出曲线。本公开中的方法能够在一定程度上克服确定出的书写轨迹与用户实际书写轨迹差异较大的问题，以改善确定出的书写轨迹效果。

Description

曲线确定方法、装置、计算机可读存储介质及设备

技术领域

本公开涉及计算机技术领域，具体而言，涉及一种曲线确定方法、曲线确定装置、计算机可读存储介质及电子设备。

背景技术

随着互联网技术的不断发展，设备可以通过识别用户的书写操作显示书写轨迹，这项技术通常应用于需要电子签名、电子绘画等场景下。目前，显示用户书写轨迹的方式为：采集书写轨迹对应的多个坐标点，通过线段将坐标点进行依次连接，以模拟用户的书写轨迹并显示。但是，由于用户的真实书写轨迹中并不会只存在折线，而是也会出现一些曲线，因此，通过这种方式确定出的书写轨迹会存在与用户实际书写轨迹差异较大的问题。

需要说明的是，在上述背景技术部分公开的信息仅用于加强对本公开的背景的理解，因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

本公开的目的在于提供一种曲线确定方法、曲线确定装置、计算机可读存储介质及电子设备，在一定程度上克服确定出的书写轨迹与用户实际书写轨迹差异较大的问题，以改善确定出的书写轨迹效果。

本公开的其他特性和优点将通过下面的详细描述变得显然，或部分地通过本公开的实践而习得。

根据本公开的第一方面，提供一种曲线确定方法，包括：

确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点；其中，第一输入点的检测时间早于第二输入点，第二输入点的检测时间早于第三输入点；

根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽；

根据第一线宽、第二线宽、第一中点和第二中点确定待连接点；

根据待连接点绘制四边形并根据四边形确定待输出曲线。

在本公开的一种示例性实施例中，根据四边形确定待输出曲线，包括：

根据预设映射规则对四边形进行颜色填充，根据颜色填充后的四边形确定待输出曲线。

在本公开的一种示例性实施例中，第一输入点、第二输入点和第三输入点为连续输入点。

在本公开的一种示例性实施例中，根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽，包括：

根据第一输入点的检测时间和第二输入点的检测时间确定从第一输入点到第二输入点的第一输入速度；

根据第二输入点的检测时间和第三输入点的检测时间确定从第二输入点到第三输入点的第二输入速度；

根据第一输入速度确定第一线宽并根据第二输入速度确定第二线宽。

在本公开的一种示例性实施例中，第一线宽和第二线宽属于预设线宽范围，预设线宽范围包括最大线宽和最小线宽。

在本公开的一种示例性实施例中，根据第一线宽、第二线宽、第一中点和第二中点确定待连接点，包括：

根据第一线宽将第一中点划分为第一待连接点和第二待连接点，第一待连接点和第二待连接点之间的距离为第一线宽，第一中点位于第一待连接点和第二待连接点的连接线上；

根据第二线宽将第二中点划分为第三待连接点和第四待连接点，第三待连接点和第四待连接点之间的距离为第二线宽，第二中点位于第三待连接点和第四待连接点的连接线上。

在本公开的一种示例性实施例中，根据待连接点绘制四边形，包括：

通过贝塞尔曲线连接第一待连接点、第二待连接点、第三待连接点和第四待连接点，得到四边形。

根据本公开的第二方面，提供一种曲线确定装置，包括中点确定单元、线宽确定单元、连接点确定单元以及曲线绘制单元，其中：

中点确定单元，用于确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点；其中，第一输入点的检测时间早于第二输入点，第二输入点的检测时间早于第三输入点；

线宽确定单元，用于根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽；

连接点确定单元，用于根据第一线宽、第二线宽、第一中点和第二中点确定待连接点；

曲线绘制单元，用于根据待连接点绘制四边形并根据四边形确定待输出曲线。

在本公开的一种示例性实施例中，曲线绘制单元根据四边形确定待输出曲线的方式具体可以为：

曲线绘制单元根据预设映射规则对四边形进行颜色填充，根据颜色填充后的四边形确定待输出曲线。

在本公开的一种示例性实施例中，线宽确定单元根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽的方式具体可以为：

线宽确定单元根据第一输入点的检测时间和第二输入点的检测时间确定从第一输入点到第二输入点的第一输入速度；

线宽确定单元根据第二输入点的检测时间和第三输入点的检测时间确定从第二输入点到第三输入点的第二输入速度；

线宽确定单元根据第一输入速度确定第一线宽并根据第二输入速度确定第二线宽。

在本公开的一种示例性实施例中，连接点确定单元根据第一线宽、第二线宽、第一中点和第二中点确定待连接点的方式具体可以为：

连接点确定单元根据第一线宽将第一中点划分为第一待连接点和第二待连接点，第一待连接点和第二待连接点之间的距离为第一线宽，第一中点位于第一待连接点和第二待连接点的连接线上；

连接点确定单元根据第二线宽将第二中点划分为第三待连接点和第四待连接点，第三待连接点和第四待连接点之间的距离为第二线宽，第二中点位于第三待连接点和第四待连接点的连接线上。

在本公开的一种示例性实施例中，曲线绘制单元根据待连接点绘制四边形的方式具体可以为：

曲线绘制单元通过贝塞尔曲线连接第一待连接点、第二待连接点、第三待连接点和第四待连接点，得到四边形。

根据本公开的第三方面，提供一种电子设备，包括：处理器；以及存储器，用于存储所述处理器的可执行指令；其中，所述处理器配置为经由执行所述可执行指令来执行上述任意一项所述的方法。

根据本公开的第四方面，提供一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现上述任意一项所述的方法。

本公开示例性实施例可以具有以下部分或全部有益效果：

在本公开的一示例实施方式所提供的曲线确定方法中，可以确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点；其中，第一输入点的检测时间早于第二输入点，第二输入点的检测时间早于第三输入点；根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽；根据第一线宽、第二线宽、第一中点和第二中点确定待连接点；根据待连接点绘制四边形并根据四边形确定待输出曲线，进而，可以根据确定出的多个待输出曲线一定程度的还原用户书写轨迹。依据上述方案描述，本公开一方面能够在一定程度上克服确定出的书写轨迹与用户实际书写轨迹差异较大的问题，以改善确定出的书写轨迹效果；另一方面，能够根据通过确定出的四边形确定出待输出曲线，以实现对浮点型线段的绘制；又一方面，能够通过用户的输入点计算出线宽，以实现书写还原过程中线宽的连续变化。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本公开。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理。显而易见地，下面描述中的附图仅仅是本公开的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1示出了可以应用本公开实施例的一种曲线确定方法及曲线确定装置的示例性系统架构的示意图；

图2示出了适于用来实现本公开实施例的电子设备的计算机系统的结构示意图；

图3示意性示出了根据本公开的一个实施例的曲线确定方法的流程图；

图4示意性示出了根据本公开的一个实施例的根据第一线宽、第二线宽、第一中点和第二中点确定出待连接点的示意图；

图5示意性示出了根据本公开的另一个实施例的根据第一线宽、第二线宽、第一中点和第二中点确定出待连接点的示意图；

图6示意性示出了根据本公开的一个实施例的待输出曲线比对示意图；

图7示意性示出了根据本公开的另一个实施例的曲线确定方法的流程图；

图8示意性示出了根据本公开的一个实施例中的曲线确定装置的结构框图。

具体实施方式

现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本公开将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。在下面的描述中，提供许多具体细节从而给出对本公开的实施方式的充分理解。然而，本领域技术人员将意识到，可以实践本公开的技术方案而省略所述特定细节中的一个或更多，或者可以采用其它的方法、组元、装置、步骤等。在其它情况下，不详细示出或描述公知技术方案以避免喧宾夺主而使得本公开的各方面变得模糊。

此外，附图仅为本公开的示意性图解，并非一定是按比例绘制。图中相同的附图标记表示相同或类似的部分，因而将省略对它们的重复描述。附图中所示的一些方框图是功能实体，不一定必须与物理或逻辑上独立的实体相对应。可以采用软件形式来实现这些功能实体，或在一个或多个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。

图1示出了可以应用本公开实施例的一种曲线确定方法及曲线确定装置的示例性应用环境的系统架构的示意图。

如图1所示，系统架构100可以包括终端设备101、102、103中的一个或多个，网络104和服务器105。网络104用以在终端设备101、102、103和服务器105之间提供通信链路的介质。网络104可以包括各种连接类型，例如有线、无线通信链路或者光纤电缆等等。终端设备101、102、103可以是具有显示屏的各种电子设备，包括但不限于台式计算机、便携式计算机、智能手机和平板电脑等等。应该理解，图1中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要，可以具有任意数目的终端设备、网络和服务器。比如服务器105可以是多个服务器组成的服务器集群等。

本公开实施例所提供的曲线确定方法一般由服务器105执行，相应地，曲线确定装置一般设置于服务器105中。但本领域技术人员容易理解的是，本公开实施例所提供的曲线确定方法也可以由终端设备101、102、103执行，相应的，曲线确定装置也可以设置于终端设备101、102、103中，本示例性实施例中对此不做特殊限定。举例而言，在一种示例性实施例中，服务器105可以确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点，以及，根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽，以及，根据第一线宽、第二线宽、第一中点和第二中点确定待连接点，以及，根据待连接点绘制四边形并根据四边形确定待输出曲线。

图2示出了适于用来实现本公开实施例的电子设备的计算机系统的结构示意图。

需要说明的是，图2示出的电子设备的计算机系统200仅是一个示例，不应对本公开实施例的功能和使用范围带来任何限制。

如图2所示，计算机系统200包括中央处理单元(CPU)201，其可以根据存储在只读存储器(ROM)202中的程序或者从储存存储部分208加载到随机访问存储器(RAM)203中的程序而执行各种适当的动作和处理。在RAM 203中，还存储有系统操作所需的各种程序和数据。CPU 201、ROM 202以及RAM 203通过总线204彼此相连。输入/输出(I/O)接口205也连接至总线204。

以下部件连接至I/O接口205：包括键盘、鼠标等的输入部分206；包括诸如阴极射线管(CRT)、液晶显示器(LCD)等以及扬声器等的输出部分207；包括硬盘等的储存存储部分208；以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分209。通信部分209经由诸如因特网的网络执行通信处理。驱动器210也根据需要连接至I/O接口205。可拆卸介质211，诸如磁盘、光盘、磁光盘、半导体存储器等等，根据需要安装在驱动器210上，以便于从其上读出的计算机程序根据需要被安装入储存存储部分208。

特别地，根据本公开的实施例，下文参考流程图描述的过程可以被实现为计算机软件程序。例如，本公开的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信部分209从网络上被下载和安装，和/或从可拆卸介质211被安装。在该计算机程序被中央处理单元(CPU)201执行时，执行本申请的方法和装置中限定的各种功能。

以下对本公开实施例的技术方案进行详细阐述：

目前，显示用户书写轨迹的方式也可以为：采集到用户通过触摸屏幕而产生的一系列坐标后，确定出每连续三个点中相邻点的坐标，并计算得到两组相邻点的坐标的中点坐标，进而，将原坐标的数据作为控制点，并将两个中点坐标分别作为起始点和结束点，通过canvas提供的绘制二次贝塞尔曲线或者三次贝塞尔曲线的方法(如，quadraticCurveTo或bezierCurveTo)进行绘制，进一步依次绘制后续所有点的坐标，以将用户输入的轨迹还原到canvas上。

现有技术中无论用户书写的速度是否变化，所还原书写轨迹的线宽都不会有所变化，采用这样的方式一方面没有根据用户输入的坐标间距进行书写速度的计算，造成了确定出的书写轨迹与用户实际书写轨迹差异较大的问题；另一方面，使用canvas原生API也无法实现浮点型线宽的设置，因此，还原的书写轨迹无法实现线宽的连续变化。

其中，需要说明的是，canvas是HTML5的元素，可以利用JavaScript脚本绘制图形。其中，HTML5是Web中的核心语言HTML的规范。HTML5继承了HTML的部分特征，并添加了许多新的语法特征，如，语义特性、本地存储特性、设备兼容特性、连接特性以及网页多媒体特性等。此外，HTML5还定义了处理非法文档的具体细节，使得所有浏览器和客户端程序能够一致地处理语法错误。

另外，canvas原生API(应用程序编程接口)中提供了绘制二次贝塞尔曲线的方法(如，quadraticCurveTo)，通过调用此方法可以绘制一条贝塞尔曲线路径；其参数分别为控制点坐标和结束点坐标。其中，quadraticCurveTo和bezierCurveTo均是一种用于为当前路径添加一条二次曲线的方法。此外，canvas原生API中还提供了可以为一个封闭路径填充颜色的方法，通过此方法可以将已经绘制好的路径填充上指定的颜色。

本示例实施方式中，传统的通过计算机画图的方式为：通过操控鼠标描绘线条的路径，但是，通过操控鼠标绘制的线条效果不佳。而通过贝塞尔工具画图能够在一定程度上优化这一问题。贝塞尔工具中应用的贝塞尔曲线也可以被称为贝兹曲线或贝济埃曲线，主要用于二维图形应用程序的数学曲线，由起始点、终止点以及控制点组成，通过调整控制点能够使得绘制的贝塞尔曲线的形状发生变化。通常情况下，矢量图形软件可以通过贝塞尔曲线精确画出所需的曲线。

其中，根据控制点的数量贝塞尔曲线可以被分为包括两个控制点的一阶贝塞尔曲线、包括三个控制点的二阶贝塞尔曲线、包括四个控制点的三阶贝塞尔曲线以及包括n+1个控制点的n阶贝塞尔曲线；其中，n为正整数。

具体地，一阶贝塞尔曲线对应的表达式为：

B(t)＝(1-t)P₀+tP₁，t∈[0,1]

二阶贝塞尔曲线对应的表达式为：

BHt)＝(1-t)²P₀+2t(1-t)P₁+t²P₂，t∈[0,1]

三阶贝塞尔曲线对应的表达式为：

B(t)＝(1-t)³P₀+3t(1-t)²P₁+3t²(1-t)P₂+t³P₃，t∈[0,1]

n阶贝塞尔曲线

其中，i为正整数。

此外，需要说明的是，本公开实施例中的曲线可以通过上述的二阶贝塞尔曲线表达式进行绘制。可选的，本公开实施例也可以确定四个输入点，以利用上述的三阶贝塞尔曲线绘制待输出曲线；或者，本公开实施例也可以确定五个输入点，以利用上述的四阶贝塞尔曲线绘制待输出曲线；或者，本公开实施例也可以确定六个输入点，以利用上述的五阶贝塞尔曲线绘制待输出曲线，同理，本公开实施例也可以确定n+1个输入点，以利用上述的n阶贝塞尔曲线绘制待输出曲线，本公开的实施例不作限定；其中，n为正整数。

请参阅图1，本示例实施方式提供了一种曲线确定方法。该曲线确定方法可以应用于上述服务器105，也可以应用于上述终端设备101、102、103中的一个或多个，本示例性实施例中对此不做特殊限定。参考图3所示，该曲线确定方法可以包括以下步骤S310至步骤S340：

步骤S310：确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点；其中，第一输入点的检测时间早于第二输入点，第二输入点的检测时间早于第三输入点。

步骤S320：根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽。

步骤S330：根据第一线宽、第二线宽、第一中点和第二中点确定待连接点。

步骤S340：根据待连接点绘制四边形并根据四边形确定待输出曲线。

其中，需要说明的是，步骤S310和步骤S320之间不存在先后关系。

下面，对于本示例实施方式的上述步骤进行更加详细的说明。

在步骤S310中，确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点；其中，第一输入点的检测时间早于第二输入点，第二输入点的检测时间早于第三输入点。

本示例实施方式中，第一输入点、第二输入点以及第三输入点可以为终端设备通过检测用户触控操作采集得到的，也可以为终端设备通过检测光标移动采集得到的，本公开的实施例不作限定。

本示例实施方式中，确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点的方式具体可以为：

采集第一输入点、第二输入点和第三输入点；

确定第一输入点、第二输入点和第三输入点分别对应的坐标；

根据第一输入点、第二输入点和第三输入点分别对应的坐标确定第一输入点和第二输入点之间的第一中点，以及第二输入点和第三输入点之间的第二中点；其中，第一中点和第二中点分别具有对应的坐标。

本示例实施方式中，第一输入点、第二输入点和第三输入点为连续输入点。

本公开可以基于HTML5中的canvas实现，并对canvas原生方法进行分装，暴露与canvas相同的API。具体调用方法如下：

其中，canvas是HTML中声明的canvas元素。points是用户输入的所有点对应的坐标数组。

具体地，可以从HTML中获取canvas元素，并使用canvas元素实例化绘制对象(Drawer)，进而，可以监听canvas元素上鼠标操作的相关事件，并针对终端(如，移动端)增加触发事件的监听，如，touchend事件、touchmove事件、touchstart事件以及touchcancel事件，以获取用户的输入内容。当用户进行书写时可以触发鼠标按下(即，代码中的mousedown)事件，进而，用户可以通过控制绘制焦点移动(即，代码中的moveTo)方法移动绘制焦点到起点坐标；进而，用户可以按住并移动鼠标，以触发鼠标移动(mousemove)事件，每次触发事件可以将获取到点的坐标记录在一个数组中，如果存储点的坐标的数组长度大于6则开始绘制，通过计算获得第一点和第二点的第一中点坐标、第二点和第三点的第二中点坐标，以计算的第一中点坐标作为起始点，第二中点坐标作为终止点，第二点为控制点绘制二次贝塞尔曲线。

本示例实施方式中，可选的，可以将canvas放大10倍(或100倍)并通过层叠样式表的style属性将其宽、高缩小10倍，以使得canvas原生提供的设置线宽的方法支持精确到小数点后1位(或2位)精度的线宽。其中，需要说明的是，层叠样式表(Cascading StyleSheets，CSS)是一种用来表现HTML或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。此外，style是CSS中的一个标签，style标签支持HTML中的全局属性和事件属性。

在步骤S320中，根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽。

本示例实施方式中，线宽可以理解为用户书写轨迹的宽度。

本示例实施方式中，根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽，包括：

本示例实施方式中，第一线宽和第二线宽属于预设线宽范围，预设线宽范围包括最大线宽和最小线宽。可以理解为，第一线宽和第二线宽均不大于最大线宽且不小于最小线宽。

可见，实施该可选的实施方式，能够使线宽随着书写速度进行相应的改变，提升了用户的书写效果，改善了用户的书写体验。

在步骤S330中，根据第一线宽、第二线宽、第一中点和第二中点确定待连接点。

本示例实施方式中，根据第一线宽、第二线宽、第一中点和第二中点确定待连接点，包括：

本示例实施方式中，根据第一线宽将第一中点划分为第一待连接点和第二待连接点的方式具体可以为：根据第一线宽和第一中点的坐标计算第一待连接点和第二待连接点。此外，根据第二线宽将第二中点划分为第三待连接点和第四待连接点的方式具体可以为：根据第二线宽和第二中点的坐标计算第三待连接点和第四待连接点。其中，第一待连接点、第二待连接点、第三待连接点和第四待连接点分别具有对应的坐标。

本示例实施方式中，第一线宽和第二线宽可以相同也可以不同，本公开的实施例不作限定。

本示例实施方式中，可选的，确定线宽的算法也可以为：

其中，this._setLineWidthBySpeed用于表示根据当前坐标与上一个输入点的坐标求距离，以距离为比例设置当前线宽。

可见，实施该可选的实施方式，能够根据通过确定出的四边形确定出待输出曲线，以实现对浮点型线段的绘制。

在步骤S340中，根据待连接点绘制四边形并根据四边形确定待输出曲线。

本示例实施方式中，还可以包括以下步骤：

当预设时长内未检测到至少三个输入点，则判定用户输入完毕并结束本次流程。

本示例实施方式中，根据待连接点绘制四边形，包括：

本示例实施方式中，通过贝塞尔曲线连接第一待连接点、第二待连接点、第三待连接点和第四待连接点的方式具体可以为：

通过贝塞尔曲线以顺时针的顺序连接第一待连接点、第二待连接点、第三待连接点和第四待连接点；或者，通过贝塞尔曲线以逆时针的顺序连接第一待连接点、第二待连接点、第三待连接点和第四待连接点，本公开的实施例不作限定。

本示例实施方式中，绘制二次贝塞尔曲线对应的绘制类如下：

其中，this._scale用于表示canvas缩放比例，以提高canvas的渲染清晰度；this.canvas用于将canvas以属性的形式暂存；this.ctx指的是canvas的绘制上下文；this._x指的是上次绘制的最终位置(如，上述的第三输入点对应的位置)对应的x坐标；this._y指的是上次绘制的最终位置(如，上述的第三输入点对应的位置)的y坐标。上述的绘制类接受一个canvas元素作为参数，在实例化阶段记录canvas的宽、高并获取canvas的绘图上下文。

本示例实施方式中，绘制二次贝塞尔曲线的算法如下：

其中，this.quadraticCurveTo用于表示通过绘制两侧贝塞尔曲线围成一个贝塞尔曲线，并通过浮点型调整贝塞尔曲线的宽度；this.stroke用于表示填充贝塞尔曲线所围成的区域；this._getPositions用于表示根据原坐标确定指定线宽的点的偏移坐标；this.moveTo用于表示移动所画轨迹开始位置到指定坐标。

具体地，quadraticCurveTo方法模拟了canvas原生的quadraticCurveTo方法的参数形式，但内部通过_getPositions方法将已知的两个点分解为四个点，进而，将计算得到的四个点使用原生的quadraticCurveTo方法围成一个封闭的四边形。进而，在需要绘制时调用stroke方法，stroke中调用了canvas的fill方法将上面封闭的四边形区域填充，从而实现对浮点型线宽的绘制。

可见，实施该可选的实施方式，能够降低确定出的书写轨迹与用户实际书写轨迹的差异，改善确定出的书写轨迹效果。

本示例实施方式中，根据四边形确定待输出曲线，包括：

本示例实施方式中，根据颜色填充后的四边形确定待输出曲线的方式具体为：将用户输入对应的填充后的多个四边形进行拼接，以得到待输出曲线。此外，在得到待输出曲线之后，还可以通过显示屏显示该待输出曲线，进一步地，也可以通过预设特效(如，弹出、上浮、由小变大等)输出该待输出曲线，本公开的实施例不作限定。

本示例实施方式中，用户进行书写操作时，终端设备可以检测到多个输入点，由于每三个连续输入点对应一个上述的四边形，因此，用户的书写操作可以对应多个四边形，对于各四边形进行填充、拼接后得到的待输出曲线(即，用户书写轨迹)可以包括一种或多种颜色(即，可以存在填充颜色不同的四边形)，本公开的实施例不作限定。

本示例实施方式中，预设映射规则用于表示四边形的边框颜色与待填充颜色的对应关系，预设映射规则可以设置为：边框颜色与填充颜色相同，如，四边形的边框颜色为黑色，那么，根据预设映射规则可以确定出待填充颜色也为黑色。其中，预设映射规则可以为用户自定义的规则，也可以为自动从颜色数据库中读取并自动进行映射关系绑定的规则，本公开的实施例不作限定。

可见，实施图3所示的曲线确定方法，能够在一定程度上克服确定出的书写轨迹与用户实际书写轨迹差异较大的问题，以改善确定出的书写轨迹效果；以及，能够根据通过确定出的四边形确定出待输出曲线，以实现对浮点型线段的绘制；以及，能够通过用户的输入点计算出线宽，以实现书写还原过程中线宽的连续变化。

请参阅图4，图4示意性示出了根据本公开的一个实施例的根据第一线宽、第二线宽、第一中点和第二中点确定出待连接点的示意图。图4包括第一四边形绘制图和第二四边形绘制图；其中，第一四边形绘制图包括四边形、第一中点P1和第二中点P2；第二四边形绘制图包括四边形、第一待连接点P1-1、第二待连接点P1-2、第三待连接点P2-1和第四待连接点P2-2。具体地，根据第一线宽能够将第一中点P1划分为第一待连接点P1-1和第二待连接点P1-2，根据第二线宽能够将第二中点P2划分为第三待连接点P2-1和第四待连接点P2-2。进而，可以根据第一待连接点P1-1、第二待连接点P1-2、第三待连接点P2-1和第四待连接点P2-2绘制第二四边形绘制图中的四边形并填充，相较第一四边形绘制图中根据第一中点P1和第二中点P2绘制、填充得到的四边形，能够一定程度上实现对用户书写还原的过程中线宽的连续变化。

结合图4所示的一个实施例的根据第一线宽、第二线宽、第一中点和第二中点确定出待连接点的示意图，请参阅图5，图5示意性示出了根据本公开的另一个实施例的根据第一线宽、第二线宽、第一中点和第二中点确定出待连接点的示意图。具体地，首先，可以确定第一输入点和第二输入点之间的第一中点P1，以及第二输入点和第三输入点之间的第二中点P2，并根据第一输入点和第二输入点确定第一线宽W1，根据第二输入点和第三输入点确定第二线宽W2。根据第一线宽W1可以将第一中点P1划分为第一待连接点P1-1和第二待连接点P1-2，根据第二线宽W2可以将第二中点P2划分为第三待连接点P2-1和第四待连接点P2-2。进而，可以按照顺时针的顺序将第一待连接点P1-1、第二待连接点P1-2、第三待连接点P2-1和第四待连接点P2-2依次进行连接，以得到四边形。根据多个用户输入点，每连续三个输入点对应一个四边形，那么，对多个四边形进行填充、拼接后，能够得到待输出曲线，该待输出曲线可以为模拟得到的用户书写轨迹。

结合图5所示的另一个实施例的根据第一线宽、第二线宽、第一中点和第二中点确定出待连接点的示意图，请参阅图6，图6示意性示出了根据本公开的一个实施例的待输出曲线比对示意图。如图6所示，图601为传统的未根据线宽绘制得到的待输出曲线(即，用户书写轨迹)，图602为根据本公开实施例绘制得到的待输出曲线(即，用户书写轨迹)，通过图601和图602的比对可见，根据本公开实施例绘制得到的待输出曲线能够使线宽随着书写速度进行相应的改变，提升了用户的书写效果，改善了用户的书写体验。

请参阅图7，图7示意性示出了根据本公开的另一个实施例的曲线确定方法的流程图。如图7所示，该曲线确定方法可以包括以下步骤S700至步骤S790：

步骤S700：检测用户输入。

步骤S710：检测是否存在至少三个输入点：第一输入点、第二输入点和第三输入点，如果是，则执行步骤S720；如果否，则执行步骤S770。

步骤S720：确定第一输入点、第二输入点和第三输入点

分别对应的坐标。

步骤S730：确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点。

步骤S740：根据第一输入点的坐标和第二输入点的坐标确定第一线宽，并根据第二输入点的坐标和第三输入点的坐标确定第二线宽。

步骤S750：根据第一线宽、第二线宽、第一中点和第二中点确定第一待连接点、第二待连接点、第三待连接点和第四待连接点。

步骤S760：通过贝塞尔曲线连接第一待连接点、第二待连接点、第三待连接点和第四待连接点，得到四边形并对四边形进行颜色填充。

步骤S770：读取下一个输入点。

步骤S780：检测该下一个输入点是否为最后一个输入点，如果是，则执行步骤S790；如果否，则执行步骤S710。

步骤S790：结束绘制。

具体地，可以对用户输入进行检测，检测方式可以为：每隔预设时长采集一次用户触控点(或用户输入点)。进而，可以检测是否存在至少三个输入点，即，第一输入点、第二输入点和第三输入点；若存在，则确定第一输入点、第二输入点以及第三输入点分别对应的坐标，若不存在，则读取下一个输入点，直到检测到存在三个连续的输入点为止。进而，可以确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点，并根据第一输入点的坐标和第二输入点的坐标确定第一线宽，根据第二输入点的坐标和第三输入点的坐标确定第二线宽，以根据第一线宽、第二线宽、第一中点和第二中点确定四个待接待点。进而，可以通过贝塞尔曲线连接第一待连接点、第二待连接点、第三待连接点和第四待连接点，以得到四边形并对四边形进行颜色填充。当检测到读取到的输入点为最后一个输入点则判定用户书写操作停止，并结束绘制。

可见，结合图4～图7实施本公开的实施例，能够在一定程度上克服确定出的书写轨迹与用户实际书写轨迹差异较大的问题，以改善确定出的书写轨迹效果；以及，能够根据通过确定出的四边形确定出待输出曲线，以实现对浮点型线段的绘制；以及，能够通过用户的输入点计算出线宽，以实现书写还原过程中线宽的连续变化。

进一步的，本示例实施方式中，还提供了一种曲线确定装置。该曲线确定装置可以应用于服务器或终端设备。参考图8所示，该曲线确定装置800可以包括中点确定单元801、线宽确定单元802、连接点确定单元803以及曲线绘制单元804，其中：

中点确定单元801，用于确定第一输入点和第二输入点之间的第一中点，并确定第二输入点和第三输入点之间的第二中点；其中，第一输入点的检测时间早于第二输入点，第二输入点的检测时间早于第三输入点；

线宽确定单元802，用于根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽；

连接点确定单元803，用于根据第一线宽、第二线宽、第一中点和第二中点确定待连接点；

曲线绘制单元804，用于根据待连接点绘制四边形并根据四边形确定待输出曲线。

其中，第一输入点、第二输入点和第三输入点为连续输入点。

可见，实施图8所示的曲线确定装置，能够在一定程度上克服确定出的书写轨迹与用户实际书写轨迹差异较大的问题，以改善确定出的书写轨迹效果；以及，能够根据通过确定出的四边形确定出待输出曲线，以实现对浮点型线段的绘制；以及，能够通过用户的输入点计算出线宽，以实现书写还原过程中线宽的连续变化。

在本公开的一种示例性实施例中，曲线绘制单元804根据四边形确定待输出曲线的方式具体可以为：

曲线绘制单元804根据预设映射规则对四边形进行颜色填充，根据颜色填充后的四边形确定待输出曲线。

可见，实施该示例性实施例，能够根据通过确定出的四边形确定出待输出曲线，以实现对浮点型线段的绘制。

在本公开的一种示例性实施例中，线宽确定单元802根据第一输入点和第二输入点确定第一线宽，并根据第二输入点和第三输入点确定第二线宽的方式具体可以为：

线宽确定单元802根据第一输入点的检测时间和第二输入点的检测时间确定从第一输入点到第二输入点的第一输入速度；

线宽确定单元802根据第二输入点的检测时间和第三输入点的检测时间确定从第二输入点到第三输入点的第二输入速度；

线宽确定单元802根据第一输入速度确定第一线宽并根据第二输入速度确定第二线宽。

其中，第一线宽和第二线宽属于预设线宽范围，预设线宽范围包括最大线宽和最小线宽。

可见，实施该示例性实施例，能够使线宽随着书写速度进行相应的改变，提升了用户的书写效果，改善了用户的书写体验。

在本公开的一种示例性实施例中，连接点确定单元803根据第一线宽、第二线宽、第一中点和第二中点确定待连接点的方式具体可以为：

连接点确定单元803根据第一线宽将第一中点划分为第一待连接点和第二待连接点，第一待连接点和第二待连接点之间的距离为第一线宽，第一中点位于第一待连接点和第二待连接点的连接线上；

连接点确定单元803根据第二线宽将第二中点划分为第三待连接点和第四待连接点，第三待连接点和第四待连接点之间的距离为第二线宽，第二中点位于第三待连接点和第四待连接点的连接线上。

可见，实施该可选的实施例，能够根据通过确定出的四边形确定出待输出曲线，以实现对浮点型线段的绘制。

在本公开的一种示例性实施例中，曲线绘制单元804根据待连接点绘制四边形的方式具体可以为：

曲线绘制单元804通过贝塞尔曲线连接第一待连接点、第二待连接点、第三待连接点和第四待连接点，得到四边形。

可见，实施该可选的实施例，能够降低确定出的书写轨迹与用户实际书写轨迹的差异，改善确定出的书写轨迹效果。

应当注意，尽管在上文详细描述中提及了用于动作执行的设备的若干模块或者单元，但是这种划分并非强制性的。实际上，根据本公开的实施方式，上文描述的两个或更多模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之，上文描述的一个模块或者单元的特征和功能可以进一步划分为由多个模块或者单元来具体化。

由于本公开的示例实施例的曲线确定装置的各个功能模块与上述曲线确定方法的示例实施例的步骤对应，因此对于本公开装置实施例中未披露的细节，请参照本公开上述的曲线确定方法的实施例。

作为另一方面，本申请还提供了一种计算机可读介质，该计算机可读介质可以是上述实施例中描述的电子设备中所包含的；也可以是单独存在，而未装配入该电子设备中。上述计算机可读介质承载有一个或者多个程序，当上述一个或者多个程序被一个该电子设备执行时，使得该电子设备实现上述实施例中所述的方法。

需要说明的是，本公开所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本公开中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本公开中，计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：无线、电线、光缆、RF等等，或者上述的任意合适的组合。

附图中的流程图和框图，图示了按照本公开各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，上述模块、程序段、或代码的一部分包含一个或多个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

描述于本公开实施例中所涉及到的单元可以通过软件的方式实现，也可以通过硬件的方式来实现，所描述的单元也可以设置在处理器中。其中，这些单元的名称在某种情况下并不构成对该单元本身的限定。

本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本公开的其它实施方案。本申请旨在涵盖本公开的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本公开的真正范围和精神由下面的权利要求指出。

应当理解的是，本公开并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限制。

Claims

1.一种曲线确定方法，其特征在于，包括：

确定第一输入点和第二输入点之间的第一中点，并确定所述第二输入点和第三输入点之间的第二中点；其中，所述第一输入点的检测时间早于所述第二输入点，所述第二输入点的检测时间早于所述第三输入点；

根据所述第一输入点和所述第二输入点确定第一线宽，并根据所述第二输入点和所述第三输入点确定第二线宽；

根据所述第一线宽、所述第二线宽、所述第一中点和所述第二中点确定待连接点；

根据所述待连接点绘制四边形并根据所述四边形确定待输出曲线。

2.根据权利要求1所述的方法，其特征在于，根据所述四边形确定待输出曲线，包括：

根据预设映射规则对所述四边形进行颜色填充，根据颜色填充后的四边形确定待输出曲线。

3.根据权利要求1所述的方法，其特征在于，所述第一输入点、所述第二输入点和所述第三输入点为连续输入点。

4.根据权利要求1所述的方法，其特征在于，根据所述第一输入点和所述第二输入点确定第一线宽，并根据所述第二输入点和所述第三输入点确定第二线宽，包括：

根据所述第一输入点的检测时间和所述第二输入点的检测时间确定从所述第一输入点到所述第二输入点的第一输入速度；

根据所述第二输入点的检测时间和所述第三输入点的检测时间确定从所述第二输入点到所述第三输入点的第二输入速度；

5.根据权利要求4所述的方法，其特征在于，所述第一线宽和所述第二线宽属于预设线宽范围，所述预设线宽范围包括最大线宽和最小线宽。

6.根据权利要求1所述的方法，其特征在于，根据所述第一线宽、所述第二线宽、所述第一中点和所述第二中点确定待连接点，包括：

根据所述第一线宽将所述第一中点划分为第一待连接点和第二待连接点，所述第一待连接点和所述第二待连接点之间的距离为所述第一线宽，所述第一中点位于所述第一待连接点和所述第二待连接点的连接线上；

根据所述第二线宽将所述第二中点划分为第三待连接点和第四待连接点，所述第三待连接点和所述第四待连接点之间的距离为所述第二线宽，所述第二中点位于所述第三待连接点和所述第四待连接点的连接线上。

7.根据权利要求6所述的方法，其特征在于，根据所述待连接点绘制四边形，包括：

通过贝塞尔曲线连接所述第一待连接点、所述第二待连接点、所述第三待连接点和所述第四待连接点，得到四边形。

8.一种曲线确定装置，其特征在于，包括：

中点确定单元，用于确定第一输入点和第二输入点之间的第一中点，并确定所述第二输入点和第三输入点之间的第二中点；其中，所述第一输入点的检测时间早于所述第二输入点，所述第二输入点的检测时间早于所述第三输入点；

线宽确定单元，用于根据所述第一输入点和所述第二输入点确定第一线宽，并根据所述第二输入点和所述第三输入点确定第二线宽；

连接点确定单元，用于根据所述第一线宽、所述第二线宽、所述第一中点和所述第二中点确定待连接点；

曲线绘制单元，用于根据所述待连接点绘制四边形并根据所述四边形确定待输出曲线。

9.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1-7任一项所述的方法。

10.一种电子设备，其特征在于，包括：

处理器；以及

存储器，用于存储所述处理器的可执行指令；

其中，所述处理器配置为经由执行所述可执行指令来执行权利要求1-7任一项所述的方法。