Interpolation

Interpolation is a term used to describe the process of finding values that lie between a set of known points. Consider the equation of the line passing through points A and B:

图片说明

where P is any point on the line and D is the vector from A to B:

图片说明

We can therefore write this equation as

图片说明

It is easy to see that when t is 0, P is equal to A; and when t is 1, P is equal to A + B - A, which is simply B.

If t lies between 0.0 and 1.0, then P will end up somewhere between A and B. Values of t outside this range will push P off the ends of the line.

Linear interpolation is such a common operation in graphics that GLSL includes a built-in function specifically for this purpose, mix:

template <typename T>
static inline T mix(const T& A, const T& B, typename T::element_type t)
{
    return B + t * (B - A);
}

template <typename T>
static inline T mix(const T& A, const T& B, const T& t)
{
    return B + t * (B - A);
}

};

Curves

A curve can be represented by three or more control points. For most curves, there are more than three control points, two of which form the endpoints; the others define the shape of the curve.

图片说明

The curve shown above has three control points, A, B, and C. A and C are the endpoints of the curve and B defines the shape of the curve.

If we join points A and B with one line and points B and C together with another line, then we can interpolate along the two lines using a simple linear interpolation to find a new pair of points, D and E. Given these two points, we can join them with yet another line and interpolate along it to find a new point, P.

Mathematically, this is

图片说明

图片说明

图片说明

Substituting for D and E and doing a little crunching, we come up with the following:

图片说明

图片说明

图片说明

图片说明

This is a quadratic equation in t. The curve that it describes is known as a quadratic Bezier curve.

By adding a fourth control point, we can increase the order by 1 and produce a cubic Bezier curve.

图片说明

We now have four control points, A, B, C and D. We form a first line from A to B, a second line from B to C, and a third line from C to D. Interpolating along each of the three lines gives rise to three new points, E, F and G. Using these three points, we form two more lines, one from E to F and another from F to G, interpolating along which gives rise to points H and I, between which we can interpolate to find our final point, P.

Therefore, we have

图片说明
图片说明
图片说明
图片说明
图片说明
图片说明

Points E, F and G form a quadratic Bezier curve that we use to interpolate to our final point P.

In practice, curves with more than four control points are not commonly used. Rather, we use splines.

Splines

A spline is effectively a long curve made up of several smaller curves that locally define their shape. At least the control points representing the ends of the curves are shared between segments, and often one or more of the interior control points either shared or linked in some way between adjacent segments.

图片说明

In above figure, the curve is defined by ten control points, A through J, which form three cubic Bezier curves. The first is defined by A, B, C and D, the second shares D and further uses E, F, and G, and the third shares G and adds H, I, and J.

This is known as a cubic B-spline.

To interpolate point P along the spline, we simply divide it into three regions, allowing t to range from 0.0 to 3.0. Thus, the integer part of t determines the curve segment along which we are interpolating and the fractional part of t is used to interpolate along the segment.