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

Question

假设我使用一系列bezierCurveTo()调用创建了弯曲路径。我想通过增加逐帧绘制的百分比来使其逐渐出现在动画中。问题是我找不到仅绘制画布路径的一部分的标准方法-有人知道实现此目的的好方法（甚至是棘手的方法）吗？

Answer 1

当然……西蒙·波里特为我们做了所有艰苦的数学计算！

jsBezier 是一个带有函数的小库：pointAlongCurveFrom(curve, location, distance)，它可以让您沿着贝塞尔曲线逐步绘制每个点。

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

Answer 2

刚刚找到了一个可以做到这一点的小型图书馆：https ://github.com/camoconnell/lazy-line-painter

它依赖于 Raphael 库 ( http://raphaeljs.com/ )，两者放在一起不会产生太大的有效负载。