One Dimensional Rational Quadratic Bezier Curve

Click and drag control points to change curve. Modify weights in boxes below the curve.

For more information, check out the post on my blog: Bezier Curves.


Your browser doesn't seem to support the necesary html5 features ):
W1
W2
W3

Rational quadratic bezier curves have 3 control points, a weight per control point (3 total), and total up the values of the 3 functions below to get the final point at time t.
  1. A * W1 * (1-t)^2
  2. B * W2 * 2t(1-t)
  3. C * W3 * t^2
Then they divide by the total of these 3 functions.
  1. W1 * (1-t)^2
  2. W2 * 2t(1-t)
  3. W3 * t^2
Parameters:
t - "time", but in our case we are going to use the x axis value for t.
A - The first control point, which is also the value of the function when x = 0.
B - The second control point.
C - The third control point, which is also the value of the function when x = 1.
W1 - The weighting for control point A.
W2 - The weighting for control point B.
W3 - The weighting for control point C.

In this particular case, A, B and C are scalars, which makes the curve into the function:
y = (A * W1 * (1-x)^2 + B * W2 * 2x(1-x) + C * W3 * x^2) / (W1 * (1-x)^2 + W2 * 2x(1-x) + W3 * x^2)

Note that this bezier curve is 1 dimensional because A,B,C are 1 dimensional, but you could use these same equations in any dimension. Also, these control points range from 0 to 1 on the X axis, but you could scale the X axis and/or the Y axis to get a different range of values.