Bézier curves

Bézier curves are parametric curves resulting from parametric equations.
All images come from the demos I programmed that are at the bottom of the page.

Parametric equations express a set of quantities as explicit functions of a number of "parameters".

A Bézier curve takes as input the coordinates in x and y, and z (3D case) plus the variable t (time it takes to traverse the curve), and outputs a new point (red dot).

Case 1: A linear Bézier takes as input two points (A (magenta dot) and B (blue dot)) and outputs a new point W (red dot) (linear interpolation).

The equation to get a third point C in the middle of A and B:

$$W = {1\over 2}A + {1\over 2}B$$

The parametric expression of C results in the graphing of the parametric curve at points (x, y) regarding various t's:

$$W = (1-t)A + tB$$

$$W = (1-0.7)A + 0.7B$$

Case 2: A Quadratic or 3rd degree Bézier results from extrapolating case 1, where a new control point C (cyan) is added, and the interpolation happens between A and B, and B and C. A further step of interpolation between the new points D and E (orange) result in the t parameter W (red dot).

We could take what we learnt from the 2nd degree Bézier and apply it to higher degrees, but what we need is the interpolation of the interpolation of the interpolation.

$$D = (1-t)A + tB$$

$$E = (1-t)B + tC$$

$$W = (1-t)D + tE$$

This is a system of equations, so we can substitute D and E directly into W without having to precompute them:

$$W = (1-t)[(1-t)A + tB] + t[(1-t)B+tC]$$

$$W = A(1-t)^2+2t(1-t)B + t^2C$$

Case 3: Cubic or degree 4 Bézier curve, which extrapolates from the first and second cases, and it could be taken to higher degrees too.

$$E = (1-t)A + tB$$

$$F = (1-t)B + tC$$

$$G = (1-t)C + tD$$

$$H = (1-t)E + tF$$

$$I = (1-t)F + tG$$

$$W = (1-t)H + tI$$

This again a system of equations, so we can substitute the previous interpolations into the last ones:

$$W = (1-t)[(1-t)(1-t)A + tB + (1-t)B + tC] + t[(1-t)(1-t)B+tC+(1-t)C+tD]$$

That corresponds to:

$$W = A(1-t)^3+3Bt(1-t)^2+3Ct^2(1-t)+Dt^3$$

Rational Bézier Curves

We could add another parameter called "weight" to the equations, which corresponds to the strength each t point is discretely pulled towards the control point. The equation reflects the transformed t parameter regarding both the calculations on the effect of weighted control points (control point * weight * t), and the parametrized (between 0 and 1) calculations amongst the weights and the parameter t (w * t), for each t being evaluated.

Linear:

$$W = {(1-t)Aw1 + tBw2\over (1-t)w1 + tw2}$$

Quadratic:

$$W = {Aw1(1-t)^2+2t(1-t)Bw2 + t^2Cw3\over w1(1-t)^2+2t(1-t)w2 + t^2w3}$$

Cubic:

$$W = {Aw1(1-t)^3+3Bw2t(1-t)^2+3Cw3t^2(1-t)+Dw4t^3\over{w1(1-t)^3+3w2t(1-t)^2+3w3t^2(1-t)+w4t^3}}$$

Examples:

All weights are the same (equal to non-weighted):

Differing weights:

Interactive demos:

CPU Version

GPU Version
*Best to stay away from this one if you don't have a beefy GPU