CN109408161A - 一种模拟毛笔笔触的绘制算法 - Google Patents
一种模拟毛笔笔触的绘制算法 Download PDFInfo
- Publication number
- CN109408161A CN109408161A CN201810963343.6A CN201810963343A CN109408161A CN 109408161 A CN109408161 A CN 109408161A CN 201810963343 A CN201810963343 A CN 201810963343A CN 109408161 A CN109408161 A CN 109408161A
- Authority
- CN
- China
- Prior art keywords
- writing
- style
- sample
- coordinate
- paintbrush
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Pending
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F9/00—Arrangements for program control, e.g. control units
- G06F9/06—Arrangements for program control, e.g. control units using stored programs, i.e. using an internal store of processing equipment to receive or retain programs
- G06F9/44—Arrangements for executing specific programs
- G06F9/451—Execution arrangements for user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06T—IMAGE DATA PROCESSING OR GENERATION, IN GENERAL
- G06T11/00—2D [Two Dimensional] image generation
- G06T11/001—Texturing; Colouring; Generation of texture or colour
Landscapes
- Engineering & Computer Science (AREA)
- Software Systems (AREA)
- Theoretical Computer Science (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- General Engineering & Computer Science (AREA)
- Processing Or Creating Images (AREA)
Abstract
本发明公开了一种模拟毛笔笔触的绘制算法，涉及笔迹绘制领域。本发明包括如下步骤：步骤S01采集坐标样本：监听鼠标移动事件来实时获取鼠标的移动轨迹；步骤S02样本筛选：对采集的坐标样本与坐标样本之间，设置相应的阈值进行筛选；步骤S03处理笔触笔锋：计算采集样本点与点之间的距离和对应两次采集的时间差计算速度来设置画笔宽度；步骤S04消除锯齿：采用贝塞尔曲线绘制方式，消除绘制曲线的锯齿感。本发明通过监听鼠标左键事件采集坐标样本，对采集的样本进行筛选并处理笔触笔峰，利用贝塞尔曲线绘制方式消除绘制曲线的锯齿感，降低了计算的处理步骤，避免了绘制延迟、卡顿的现象，提升了笔迹绘制效果。
Description
技术领域
本发明属于笔迹绘制领域，特别是涉及一种模拟毛笔笔触的绘制算法。
背景技术
目前市面上对于模拟毛笔笔触绘制的可借鉴的资料少之又少，在少数成型的demo里面需要收取高额的费用才提供技术支持。在部分demo里面对于绘制的思路也是不同，各有优缺点，没有将遇到的所有问题综合到一起，导致了某一版本绘制很流畅但对于曲线的锯齿、阴影等美观方面的处理很差；某一版本对笔触笔锋处理的很好，但是经过了大量的计算之后，绘制会出现延迟、卡顿等情况。
因此急需一种能够实现了对绘制流畅度的优化，保证了可以在低延迟下稳定绘制的版本；实现了对笔触笔锋的优化，保证了可以有绘制毛笔的感觉；实现了对曲线锯齿、阴影等美观方面的优化，保证了可以在绘制之后以一种平滑、流畅的形式展现给用户；保证了不同用户对绘制的需求。
发明内容
本发明的目的在于提供一种模拟毛笔笔触的绘制算法，通过监听鼠标左键事件采集坐标样本，对采集的样本进行筛选并处理笔触笔峰，利用贝塞尔曲线绘制方式消除绘制曲线的锯齿感，解决了现有的笔触笔锋处理需要大量计算容易出现绘制延迟、卡段的问题。
为解决上述技术问题，本发明是通过以下技术方案实现的：
本发明为一种模拟毛笔笔触的绘制算法，包括如下步骤：
步骤S01采集坐标样本：监听鼠标移动事件来实时获取鼠标的移动轨迹；
步骤S02样本筛选：对采集的坐标样本与坐标样本之间，设置相应的阈值进行筛选；
步骤S03处理笔触笔锋：计算采集样本点与点之间的距离和对应两次采集的时间差计算速度来设置画笔宽度；
步骤S04消除锯齿：采用贝塞尔曲线绘制方式，消除绘制曲线的锯齿感。
优选地，所述步骤S02中，设置的阙值包括两次采集的距离和两次采集的时间差；其中，两次采集距离的阙值范围在3-4个像素，两次采集时间差的阈值范围在25ms-100ms。
优选地，所述步骤S03中，速度的计算公式为
其中，S为画笔的移动速度，d为采集两点之间的距离，t为两次采集时间的差值；笔画的宽度计算步骤如下：
步骤T01：计算得到新的画笔宽度；
步骤T02：当前画笔宽度与上一次的画笔宽度进行相减取绝对值；
步骤T03：将获取的绝对值与最大变化值进行比较；
若小于绝对值，则执行步骤T04；
若大于绝对值，则执行步骤T05；
步骤T04：上一次画笔宽度减最大变化值；
步骤T05：上一次画笔宽度加最大变化值；
步骤T06：当前画笔宽度与上一次画笔宽度取中点加上修饰值；
步骤T07：获取当前画笔宽度。
优选地，所述步骤T07后，当画笔结束鼠标左键抬起时，根据当前画笔宽度再次绘制一端距离用于绘制阴影效果。
优选地，所述步骤S04中，贝塞尔曲线绘制方式至少达到四个点才开始绘制，具体绘制步骤如下：
步骤P01：集合新添加一个坐标点；
步骤P02：判断集合坐标点总数是否超过四个；
若否，则返回步骤P01；
若是，则执行步骤P03；
步骤P03：取后四个坐标点计算出三个控制点；
步骤P04：根据三个控制点计算出两个控制点；
步骤P05：根据偏移的线性关系y＝kx+b，求最终的控制点；
步骤P06：根据两个控制点和最后的坐标绘制曲线。
优选地，所述步骤P03中，取四个坐标点的依次为上一个点A、当前点B、下一个点C和下一个点2D；三个控制点C1、C2、C3分别为线段AB的中点、线段BC的中点和线段CD的中点。
优选地，所述步骤P04中，得到的三个控制点C1、C2、C3分别取C1C2线段的中点和C2C3线段的中点，得到两个控制点D1和D2。
优选地，所述步骤P05中，根据线性关系y＝kx+b计算两个控制点D1和D2的最终控制点cot1和cot2；其中，k为平滑系数。
本发明具有以下有益效果：
本发明通过监听鼠标左键事件采集坐标样本，对采集的样本进行筛选并处理笔触笔峰，利用贝塞尔曲线绘制方式消除绘制曲线的锯齿感，降低了计算的处理步骤，避免了绘制延迟、卡顿的现象，提升了笔迹绘制效果。
当然，实施本发明的任一产品并不一定需要同时达到以上所述的所有优点。
附图说明
为了更清楚地说明本发明实施例的技术方案，下面将对实施例描述所需要使用的附图作简单地介绍，显而易见地，下面描述中的附图仅仅是本发明的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。
图1为本发明的一种模拟毛笔笔触的绘制算法步骤示意图；
图2为笔画的宽度计算步骤图；
图3为贝塞尔曲线绘制的具体步骤示意图。
具体实施方式
下面将结合本发明实施例中的附图，对本发明实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本发明一部分实施例，而不是全部的实施例。基于本发明中的实施例，本领域普通技术人员在没有作出创造性劳动前提下所获得的所有其它实施例，都属于本发明保护的范围。
请参阅图1所示，本发明为一种模拟毛笔笔触的绘制算法，包括如下步骤：
步骤S01采集坐标样本：监听鼠标移动事件来实时获取鼠标的移动轨迹，将轨迹作为最终路径，每次采集的一个点存入坐标集合并开始绘制，多次绘制则不断重复以上的步骤；采集坐标样本也可以通过接入外接设备获得，例如高速相机取点，从检测到点开始到第一次没有检测到点作为一条完整的绘制路径，多次绘制则不断重复以上的步骤。
步骤S02样本筛选：对采集的坐标样本与坐标样本之间，设置相应的阈值进行筛选；
步骤S03处理笔触笔锋：计算采集样本点与点之间的距离和对应两次采集的时间差计算速度来设置画笔宽度；
步骤S04消除锯齿：采用贝塞尔曲线绘制方式，消除绘制曲线的锯齿感。
其中，步骤S02中，设置的阙值包括两次采集的距离和两次采集的时间差；其中，两次采集距离的阙值范围在3-4个像素，两次采集时间差的阈值范围大于25ms，上线可根据软件需求进行相应的设置，因此可以省去许多冗余的计算。
其中，步骤S03中，速度的计算公式为
其中，S为画笔的移动速度，d为采集两点之间的距离，t为两次采集时间的差值；
请参阅图2所示，笔画的宽度计算步骤如下：
步骤T01：计算得到新的画笔宽度，画笔宽度可以根据速度来设置画笔的宽度，也可以根据用户按下的力道来设置画笔的宽度，按下的力道通过压力传感器来获取；
步骤T02：当前画笔宽度与上一次的画笔宽度进行相减取绝对值，；
步骤T03：将获取的绝对值与最大变化值进行比较，当得到画笔宽度之后，利用当前的画笔宽度与上一次的画笔宽度previousPwidth进行相减取绝对值，找出一个可接受的最大的变化值max_dif(一般看画笔粗细最大可以变化多少diffMaxWidth)；如果差值超过可接受的变化值，则在上一次画笔宽度到当前画笔宽度之间再次进行(max_dif/diffMaxWidth)次绘制，当前每次的绘制都是一个线性关系；在速度过快，画笔宽度变化比较明显的地方需要采取多次绘制来弥补绘制的不够圆润问题；
若小于绝对值，则执行步骤T04；
若大于绝对值，则执行步骤T05；
步骤T04：上一次画笔宽度减最大变化值；
步骤T05：上一次画笔宽度加最大变化值；
步骤T06：当前画笔宽度与上一次画笔宽度取中点加上修饰值；
步骤T07：获取当前画笔宽度。
其中，步骤T07后，当画笔结束鼠标左键抬起或手指绘制结束时，根据上一次的画笔宽度previousPwidth再次绘制一段距离，留下笔锋的设计，不需要改变颜色的透明度，除非绘制的速度很快(用户希望留下一个长长的尾巴)，则绘制阴影效果。
请参阅图3所示，步骤S04中，贝塞尔曲线绘制方式至少达到四个点才开始绘制，具体绘制步骤如下：
步骤P01：集合新添加一个坐标点；
步骤P02：判断集合坐标点总数是否超过四个；
若否，则返回步骤P01；
若是，则执行步骤P03；
步骤P03：取后四个坐标点计算出三个控制点；
步骤P04：根据三个控制点计算出两个控制点；
步骤P05：根据偏移的线性关系y＝kx+b，求最终的控制点；
步骤P06：根据两个控制点和最后的坐标绘制曲线。
其中，步骤P03中，取四个坐标点的依次为上一个点A、当前点B、下一个点C和下一个点2D；三个控制点C1、C2、C3分别为线段AB的中点、线段BC的中点和线段CD的中点；线段的中点计算公式为：
其中，步骤P04中，得到的三个控制点C1、C2、C3分别取C1C2线段的中点和C2C3线段的中点，得到两个控制点D1和D2。
其中，步骤P05中，根据线性关系y＝kx+b计算两个控制点D1和D2的最终控制点cot1和cot2；其中，k为平滑系数，取值在0到0.5之间，多次实验证明取0.5最好；这样利用最终的cot1、cot2和C就可以绘制一条平滑的贝塞尔曲线，然后结合当前绘制段的画笔宽度和分配的颜色就可以实现笔触，但是画面锯齿感严重，采取的方式是在原有的基础上在复制一份当前的曲线，画笔宽度增大四个像素，改变了原有的画笔颜色，将画笔原有颜色的透明的降低作为背景，在此背景上再次绘制曲线即可达到曲线平滑圆润，锯齿感不明显，同时有笔触和笔锋的效果。
值得注意的是，上述系统实施例中，所包括的各个单元只是按照功能逻辑进行划分的，但并不局限于上述的划分，只要能够实现相应的功能即可；另外，各功能单元的具体名称也只是为了便于相互区分，并不用于限制本发明的保护范围。
另外，本领域普通技术人员可以理解实现上述各实施例方法中的全部或部分步骤是可以通过程序来指令相关的硬件来完成，相应的程序可以存储于一计算机可读取存储介质中。
以上公开的本发明优选实施例只是用于帮助阐述本发明。优选实施例并没有详尽叙述所有的细节，也不限制该发明仅为所述的具体实施方式。显然，根据本说明书的内容，可作很多的修改和变化。本说明书选取并具体描述这些实施例，是为了更好地解释本发明的原理和实际应用，从而使所属技术领域技术人员能很好地理解和利用本发明。本发明仅受权利要求书及其全部范围和等效物的限制。
Claims (8)
1.一种模拟毛笔笔触的绘制算法，其特征在于，包括如下步骤：
步骤S01采集坐标样本：监听鼠标移动事件来实时获取鼠标的移动轨迹；
步骤S02样本筛选：对采集的坐标样本与坐标样本之间，设置相应的阈值进行筛选；
步骤S03处理笔触笔锋：计算采集样本点与点之间的距离和对应两次采集的时间差计算速度来设置画笔宽度；
步骤S04消除锯齿：采用贝塞尔曲线绘制方式，消除绘制曲线的锯齿感。
2.根据权利要求1所述的一种模拟毛笔笔触的绘制算法，其特征在于，所述步骤S02中，设置的阙值包括两次采集的距离和两次采集的时间差；其中，两次采集距离的阙值范围在3-4个像素，两次采集时间差的阈值范围在25ms-100ms。
3.根据权利要求1所述的一种模拟毛笔笔触的绘制算法，其特征在于，所述步骤S03中，速度的计算公式为
其中，S为画笔的移动速度，d为采集两点之间的距离，t为两次采集时间的差值；笔画的宽度计算步骤如下：
步骤T01：计算得到新的画笔宽度；
步骤T02：当前画笔宽度与上一次的画笔宽度进行相减取绝对值；
步骤T03：将获取的绝对值与最大变化值进行比较；
若小于绝对值，则执行步骤T04；
若大于绝对值，则执行步骤T05；
步骤T04：上一次画笔宽度减最大变化值；
步骤T05：上一次画笔宽度加最大变化值；
步骤T06：当前画笔宽度与上一次画笔宽度取中点加上修饰值；
步骤T07：获取当前画笔宽度。
4.根据权利要求3所述的一种模拟毛笔笔触的绘制算法，其特征在于，所述步骤T07后，当画笔结束鼠标左键抬起时，根据当前画笔宽度再次绘制一段距离用于绘制阴影效果。
5.根据权利要求1所述的一种模拟毛笔笔触的绘制算法，其特征在于，所述步骤S04中，贝塞尔曲线绘制方式至少达到四个点才开始绘制，具体绘制步骤如下：
步骤P01：集合新添加一个坐标点；
步骤P02：判断集合坐标点总数是否超过四个；
若否，则返回步骤P01；
若是，则执行步骤P03；
步骤P03：取后四个坐标点计算出三个控制点；
步骤P04：根据三个控制点计算出两个控制点；
步骤P05：根据偏移的线性关系y＝kx+b，求最终的控制点；
步骤P06：根据两个控制点和最后的坐标绘制曲线。
6.根据权利要求5所述的一种模拟毛笔笔触的绘制算法，其特征在于，所述步骤P03中，取四个坐标点的依次为上一个点A、当前点B、下一个点C和下一个点2D；三个控制点C1、C2、C3分别为线段AB的中点、线段BC的中点和线段CD的中点。
7.根据权利要求5所述的一种模拟毛笔笔触的绘制算法，其特征在于，所述步骤P04中，得到的三个控制点C1、C2、C3分别取C1C2线段的中点和C2C3线段的中点，得到两个控制点D1和D2。
8.根据权利要求5所述的一种模拟毛笔笔触的绘制算法，其特征在于，所述步骤P05中，根据线性关系y＝kx+b计算两个控制点D1和D2的最终控制点cot1和cot2；其中，k为平滑系数。
Priority Applications (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810963343.6A CN109408161A (zh) | 2018-08-22 | 2018-08-22 | 一种模拟毛笔笔触的绘制算法 |
Applications Claiming Priority (1)
| Application Number | Priority Date | Filing Date | Title |
|---|---|---|---|
| CN201810963343.6A CN109408161A (zh) | 2018-08-22 | 2018-08-22 | 一种模拟毛笔笔触的绘制算法 |
Publications (1)
| Publication Number | Publication Date |
|---|---|
| CN109408161A true CN109408161A (zh) | 2019-03-01 |
Family
ID=65464365
Family Applications (1)
| Application Number | Title | Priority Date | Filing Date |
|---|---|---|---|
| CN201810963343.6A Pending CN109408161A (zh) | 2018-08-22 | 2018-08-22 | 一种模拟毛笔笔触的绘制算法 |
Country Status (1)
| Country | Link |
|---|---|
| CN (1) | CN109408161A (zh) |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113760432A (zh) * | 2021-08-30 | 2021-12-07 | 浙江万朋教育科技股份有限公司 | 一种基于H5 Canvas实现还原手写笔迹的涂鸦方法 |
Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20110199381A1 (en) * | 2008-11-07 | 2011-08-18 | Junichi Tamai | Bezier curve drawing device, bezier curve drawing method, and recording medium |
| CN102521858A (zh) * | 2011-11-28 | 2012-06-27 | 北京盛世宣合信息科技有限公司 | 电子毛笔书写笔迹生成方法 |
| CN103559732A (zh) * | 2013-10-15 | 2014-02-05 | 锐达互动科技股份有限公司 | 一种生成毛笔笔迹的方法 |
| CN104714742A (zh) * | 2013-12-12 | 2015-06-17 | 鸿合科技有限公司 | 一种基于触屏的软笔实现方法及装置 |
| CN105225260A (zh) * | 2015-09-25 | 2016-01-06 | 中国电子科技集团公司第三十二研究所 | 一种手写原笔迹实现方法 |
| CN106527940A (zh) * | 2016-11-03 | 2017-03-22 | 青岛海信电器股份有限公司 | 书写笔迹确定方法及装置 |
| CN106687891A (zh) * | 2014-09-15 | 2017-05-17 | 微软技术许可有限责任公司 | 数字墨水的平滑和gpu使能的渲染 |
| CN107767429A (zh) * | 2016-08-18 | 2018-03-06 | 阿里巴巴集团控股有限公司 | 曲线生成方法及设备 |
-
2018
- 2018-08-22 CN CN201810963343.6A patent/CN109408161A/zh active Pending
Patent Citations (8)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| US20110199381A1 (en) * | 2008-11-07 | 2011-08-18 | Junichi Tamai | Bezier curve drawing device, bezier curve drawing method, and recording medium |
| CN102521858A (zh) * | 2011-11-28 | 2012-06-27 | 北京盛世宣合信息科技有限公司 | 电子毛笔书写笔迹生成方法 |
| CN103559732A (zh) * | 2013-10-15 | 2014-02-05 | 锐达互动科技股份有限公司 | 一种生成毛笔笔迹的方法 |
| CN104714742A (zh) * | 2013-12-12 | 2015-06-17 | 鸿合科技有限公司 | 一种基于触屏的软笔实现方法及装置 |
| CN106687891A (zh) * | 2014-09-15 | 2017-05-17 | 微软技术许可有限责任公司 | 数字墨水的平滑和gpu使能的渲染 |
| CN105225260A (zh) * | 2015-09-25 | 2016-01-06 | 中国电子科技集团公司第三十二研究所 | 一种手写原笔迹实现方法 |
| CN107767429A (zh) * | 2016-08-18 | 2018-03-06 | 阿里巴巴集团控股有限公司 | 曲线生成方法及设备 |
| CN106527940A (zh) * | 2016-11-03 | 2017-03-22 | 青岛海信电器股份有限公司 | 书写笔迹确定方法及装置 |
Cited By (1)
| Publication number | Priority date | Publication date | Assignee | Title |
|---|---|---|---|---|
| CN113760432A (zh) * | 2021-08-30 | 2021-12-07 | 浙江万朋教育科技股份有限公司 | 一种基于H5 Canvas实现还原手写笔迹的涂鸦方法 |
Similar Documents
| Publication | Publication Date | Title |
|---|---|---|
| CN106846359B (zh) | 基于视频序列的运动目标快速检测方法 | |
| CN106598227B (zh) | 基于Leap Motion和Kinect的手势识别方法 | |
| CN105718878A (zh) | 基于级联卷积神经网络的第一视角空中手写和空中交互方法 | |
| CN103164694B (zh) | 一种人体动作识别的方法 | |
| CN107067031B (zh) | 一种基于Wi-Fi信号的书法姿态自动识别方法 | |
| CN106503609B (zh) | 指纹纹线点的识别方法及装置 | |
| CN106547356B (zh) | 智能交互方法和装置 | |
| CN108197534A (zh) | 一种人头部姿态检测方法、电子设备及存储介质 | |
| CN106937059A (zh) | 基于Kinect的影像合成方法和系统 | |
| CN102096471A (zh) | 一种基于机器视觉的人机交互方法 | |
| CN103995595A (zh) | 一种基于手势的游戏体感控制方法 | |
| CN102393966A (zh) | 基于多尺度显著图的自适应图像压缩采样方法 | |
| CN109408161A (zh) | 一种模拟毛笔笔触的绘制算法 | |
| Wong et al. | Model-based analysis of Chinese calligraphy images | |
| CN107316324B (zh) | 基于cuda实现的实时立体匹配及优化的方法 | |
| CN103116897A (zh) | 一种基于图像空间的三维动态数据压缩和平滑方法 | |
| CN117237232B (zh) | 基于图像去噪的建材生产环境粉尘在线监测方法 | |
| Wang et al. | Real-time visual static hand gesture recognition system and its FPGA-based hardware implementation | |
| CN106023280A (zh) | 一种数据趋势曲线图的绘制方法 | |
| CN103186241A (zh) | 一种交互桌面触点左右手识别方法 | |
| CN109445887A (zh) | 一种模拟毛笔笔触的绘制方法 | |
| CN102073878A (zh) | 非穿戴指势视觉识别方法 | |
| CN104867129A (zh) | 一种光场图像分割方法 | |
| CN105718122B (zh) | 一种用于电容白板的轨迹平滑方法及其装置 | |
| CN101276476A (zh) | 对2d卡通动画的前景背景分离方法 |
Legal Events
| Date | Code | Title | Description |
|---|---|---|---|
| PB01 | Publication | ||
| PB01 | Publication | ||
| SE01 | Entry into force of request for substantive examination | ||
| SE01 | Entry into force of request for substantive examination | ||
| CB02 | Change of applicant information | ||
| CB02 | Change of applicant information |
Address after: 230000 Yafu Park, Juchao Economic Development Zone, Chaohu City, Hefei City, Anhui Province Applicant after: ANHUI HUISHI JINTONG TECHNOLOGY Co.,Ltd. Address before: 230000 Room 102, 1st Floor, C District, Science Park, Hefei National University, 602 Huangshan Road, Hefei High-tech Zone, Anhui Province Applicant before: ANHUI HUISHI JINTONG TECHNOLOGY Co.,Ltd. |