在拉斐尔画一半Bezier路径

Question

假设我有一个如下的三次Bezier路径(格式化用于Raphael路径函数):

M55 246S55 247 55 248

只是一个例子.这是从我的绘图应用程序中获取的,当用户按住鼠标按钮时,我使用光标绘制一条线,有点像铅笔或标记.每次用户移动鼠标时,我都会使用jquery的mousemove事件在两点之间绘制线条.在绘制线之前还有另一个(参考点),因此可以创建贝塞尔曲线.

这是我的问题:是否有可能让Raphael只画出一条给定路径的一半？我知道getSubpath()函数,但如果我对Bezier曲线的理解是正确的,那么计算第二个参数就相当困难了.动画功能的问题在于它会创建双线(也就是说,它会创建我想要的曲线,以及不应该显示的围绕它的四四方向线,可能是因为鼠标的移动速度比动画可以处理的速度快).

当然,如果我的方法本身存在某些方面的缺陷(或者我对可能的解决方案的理解),我想听听它.任何帮助,将不胜感激.

Answer 1

这有点混乱，但也许这可以回答它：

line[line.length] = paper.path(drawPath); //drawPath being the fill line length 

//get a subpath, being half the length of your bezier curve
subPath = line[line.length - 1].getSubpath(0, line[line.length - 1].getTotalLength()/2);

//remove the full-length bezier curve
line[line.length - 1].remove();

//Draw your new line
line[line.length - 1] = paper.path(subpath);

老实说，这效率很低。但是，我想不出更好的方法来解决这个问题。您不能只抓住切线并除以一半，因为贝塞尔曲线将比切线的长度更长（就像乌鸦飞一样）。这意味着您必须通过 rapheal 处理该行，然后获得长度一半的子路径。