问题描述
我有一个关于公式通过控制点弯曲的问题。
正如你所知,HTML Canvas有
然后
x1 / 2 = xt - (x0 + x2)/ 4
x1 = 2 * xt- code>
I have a question regarding formula curving through a control point.As you know, HTML Canvas has quadraticCurveTo(x1, y1, x2, y2) with x1 and x2 being the control point.
However when you try to draw a stroke using it, the stroke will never touch the control point.
So we have this formula:
x1 = xt * 2 - (x0 + x2) / 2; y1 = yt * 2 - (y0 + y2) / 2;
(xt, yt) = the point you want to curve through. t for tangent as it is 90 degrees perpendicular at that point.
This recalculates the control point position.
I got this formula from a book, however the book doesn't explain how it is been derived. I tried google around but in vain.
Anyone knows how this formula is derived?
Thanks,Venn.
Quadratic Bezier curve is described by equations:
x(t) = x0 * (1-t)^2 + 2 * x1 * t * (1 - t) + x2 * t^2 (and similar for y(t)).
If we apply parameter value t = 1/2 (in some way - middle of the curve), we will get your formula:
x(t=1/2) = xt = x0 * 1/4 + 2 * x1 * 1/4 + x2 * 1/4
then
x1/2 = xt - (x0 + x2)/4
x1 = 2 * xt - (x0 + x2)/2
这篇关于解释 - 用于通过控制点进行曲线的公式的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!