从贝塞尔曲线控制点找到一条线的方程
find the equation of a line from bezier curve control points
我想找到 y = ax2 + bx + c 形式的曲线方程
来自以下 svg 路径:
<path id="curve1" d="M100,200 C100,100 400,100 400,200" />
这给了我 4 点,可以在附图上看到。
- 100,200(起点为紫色)
- 100,100(红色控制点 1)
- 400,100(绿色控制点 2)
- 400,200(蓝色终点)
维基百科有一篇很棒的文章解释了贝塞尔曲线,但是我不确定如何应用那里显示的数学来获得曲线方程。
http://en.wikipedia.org/wiki/B%C3%A9zier_curve
你不能。
您显示的 SVG 使用三次路径,它使用三阶参数曲线,这意味着它具有以下形式:
fx(t) = x1 * (1-t)³ + x2 * 3 * (1-t)²t + x3 * 3 * (1-t)t² + x4 * t³
fy(t) = y1 * (1-t)³ + y2 * 3 * (1-t)²t + y3 * 3 * (1-t)t² + y4 * t³
(这是为 t
从 0(含)到 1(含)绘制的。
所以有两个原因导致你不能将该曲线表示为一种形式 y=ax²+b
:
- 您至少需要一个表格
ax³+bx²+c
,并且
- 这是参数曲线,不是简单的函数图;对于贝塞尔曲线,
y
根本不是用 x
表示的情况,而是 both x
和 y
值由 "master parameter" t
控制。
我们知道像 y=ax²+b
这样的二阶函数只能模拟抛物线,并且看一下图像我们可以看到绘制的曲线看起来不像其中之一(甚至不是压扁的抛物线)所以我们可以' 在这种情况下,甚至 "kind of sort of" 用二阶函数逼近曲线。
(有时你可以侥幸逃脱,但在这种情况下绝对不行)
我想找到 y = ax2 + bx + c 形式的曲线方程
来自以下 svg 路径:
<path id="curve1" d="M100,200 C100,100 400,100 400,200" />
这给了我 4 点,可以在附图上看到。
- 100,200(起点为紫色)
- 100,100(红色控制点 1)
- 400,100(绿色控制点 2)
- 400,200(蓝色终点)
维基百科有一篇很棒的文章解释了贝塞尔曲线,但是我不确定如何应用那里显示的数学来获得曲线方程。 http://en.wikipedia.org/wiki/B%C3%A9zier_curve
你不能。
您显示的 SVG 使用三次路径,它使用三阶参数曲线,这意味着它具有以下形式:
fx(t) = x1 * (1-t)³ + x2 * 3 * (1-t)²t + x3 * 3 * (1-t)t² + x4 * t³
fy(t) = y1 * (1-t)³ + y2 * 3 * (1-t)²t + y3 * 3 * (1-t)t² + y4 * t³
(这是为 t
从 0(含)到 1(含)绘制的。
所以有两个原因导致你不能将该曲线表示为一种形式 y=ax²+b
:
- 您至少需要一个表格
ax³+bx²+c
,并且 - 这是参数曲线,不是简单的函数图;对于贝塞尔曲线,
y
根本不是用x
表示的情况,而是 bothx
和y
值由 "master parameter"t
控制。
我们知道像 y=ax²+b
这样的二阶函数只能模拟抛物线,并且看一下图像我们可以看到绘制的曲线看起来不像其中之一(甚至不是压扁的抛物线)所以我们可以' 在这种情况下,甚至 "kind of sort of" 用二阶函数逼近曲线。
(有时你可以侥幸逃脱,但在这种情况下绝对不行)