如何在HTML5的画布中部分绘制路径？

比方说，我使用一系列bezierCurveTo()调用创建了曲线路径。我想让它在动画中逐渐出现，通过增加帧 - 帧后绘制的百分比。问题是，我找不到一个标准的方法来绘制画布路径的一部分 - 有人会知道一个好方法（或者甚至是一个棘手的方法）来实现这一点？如何在HTML5的画布中部分绘制路径？

来源

2013-03-02 Gnurou

对上一个问题的回答可能对您有用。 http://stackoverflow.com/questions/878862/drawing-part-of-a-bezier-curve-by-reusing-a-basic-bezier-curve-function – jing3142 2013-03-04 11:30:38

哦，这是非常有益的。荣誉。 – Gnurou 2013-03-04 14:38:56

刚刚发现了一个小库，正是这么做的：https://github.com/camoconnell/lazy-line-painter

它依靠拉斐尔LIB（http://raphaeljs.com/），和两个放在一起不作太大有效载荷。

来源

2013-03-04 15:02:42 Gnurou

当然...... Simon Porritt为我们做了所有艰难的数学！

jsBezier是一个小函数库，它有一个函数：pointAlongCurveFrom（曲线，位置，距离），可以让您逐渐绘制沿着贝塞尔曲线的每个点。

jsBezier可以在GitHub上：https://github.com/sporritt/jsBezier

来源

2013-03-02 04:19:51 markE

谢谢 - 但是我尝试过这种方法（绘制沿曲线的点）与其他环境，结果不幸的是相当缓慢，因为高透支。这可以使用，直到使用破折号的方式获得标准化（使用虚线是实现这种效果的简单方法）。仍然开放给其他答案。 – Gnurou 2013-03-02 06:16:26

顺便说一句，我还没有尝试过，但我认为Chrome现在支持与context.setLineDash（[5]）的虚线。 – markE 2013-03-02 06:25:11

没错 - 我想留在完全兼容的区域:) – Gnurou 2013-03-02 06:42:23

如何在HTML5的画布中部分绘制路径？

回答

相关问题