Bézier curve

Cubic Bézier curve

In the mathematical field of numerical analysis, a Bézier curve is a parametric curve important in computer graphics and related fields. Generalizations of Bézier curves to higher dimensions are called Bézier surfaces, of which the Bézier triangle is a special case.

Bézier curves were widely publicized in 1962 by the French engineer Pierre Bézier, who used them to design automobile bodies. The curves were first developed in 1959 by Paul de Casteljau using de Casteljau's algorithm, a numerically stable method to evaluate Bézier curves.

In vector graphics, Bézier curves are an important tool used to model smooth curves that can be scaled indefinitely. "Paths," as they are commonly referred to in image manipulation programs such as Inkscape, Adobe Illustrator, Adobe Photoshop, and GIMP are combinations of Bézier curves patched together. Paths are not bound by the limits of rasterized images and are intuitive to modify. Bézier curves are also used in animation as a tool to control motion in applications such as Adobe Flash, Adobe After Effects, and Autodesk 3ds max.

Contents

Applications

Computer graphics

Bézier path in Adobe Illustrator CS2
Example of two cubic Bézier curves patched together (solid blue line) compared to a 6th-degree Bézier curve (red dots).

Bézier curves are widely used in computer graphics to model smooth curves. As the curve is completely contained in the convex hull of its control points, the points can be graphically displayed and used to manipulate the curve intuitively. Affine transformations such as translation, scaling and rotation can be applied on the curve by applying the respective transform on the control points of the curve.

Quadratic and cubic Bézier curves are most common; higher degree curves are more expensive to evaluate. When more complex shapes are needed, low order Bézier curves are patched together. This is commonly referred to as a "path" in programs like Adobe Illustrator or Inkscape. These poly-Bézier curves can also be seen in the SVG file format. To guarantee smoothness, the control point at which two curves meet and one control point on either side must be collinear.

The simplest method for scan converting (rasterizing) a Bézier curve is to evaluate it at many closely spaced points and scan convert the approximating sequence of line segments. However, this does not guarantee that the rasterized output looks sufficiently smooth, because the points may be spaced too far apart. Conversely it may generate too many points in areas where the curve is close to linear. A common adaptive method is recursive subdivision, in which a curve's control points are checked to see if the curve approximates a line segment to within a small tolerance. If not, the curve is subdivided parametrically into two segments, 0 ≤ t ≤ 0.5 and 0.5 ≤ t ≤ 1, and the same procedure is applied recursively to each half. There are also forward differencing methods, but great care must be taken to analyse error propagation. Analytical methods where a spline is intersected with each scan line involve finding roots of cubic polynomials (for cubic splines) and dealing with multiple roots, so they are not often used in practice.

Animation

In animation applications, such as Adobe Flash and Adobe Shockwave, or in applications like Game Maker, Bézier curves are used to outline, for example, movement. Users outline the wanted path in Bézier curves, and the application creates the needed frames for the object to move along the path.

Examination of cases

Linear Bézier curves

Given points P0 and P1, a linear Bézier curve is simply a straight line between those two points. The curve is given by

\mathbf{B}(t)=\mathbf{P}_0 + t(\mathbf{P}_1-\mathbf{P}_0)=(1-t)\mathbf{P}_0 + t\mathbf{P}_1 \mbox{ , } t \in [0,1]

and is equivalent to linear interpolation.

Quadratic Bézier curves

A quadratic Bézier curve is the path traced by the function B(t), given points P0, P1, and P2,

\mathbf{B}(t) = (1 - t)^{2}\mathbf{P}_0 + 2t(1 - t)\mathbf{P}_1 + t^{2}\mathbf{P}_2 \mbox{ , } t \in [0,1].

A quadratic Bézier curve is also a parabolic segment.

TrueType fonts use Bézier splines composed of quadratic Bézier curves.

Cubic Bézier curves

Four points P0, P1, P2 and P3 in the plane or in three-dimensional space define a cubic Bézier curve. The curve starts at P0 going toward P1 and arrives at P3 coming from the direction of P2. Usually, it will not pass through P1 or P2; these points are only there to provide directional information. The distance between P0 and P1 determines "how long" the curve moves into direction P2 before turning towards P3.

The parametric form of the curve is:

\mathbf{B}(t)=(1-t)^3\mathbf{P}_0+3t(1-t)^2\mathbf{P}_1+3t^2(1-t)\mathbf{P}_2+t^3\mathbf{P}_3 \mbox{ , } t \in [0,1].

Modern imaging systems like PostScript, Asymptote and Metafont use Bézier splines composed of cubic Bézier curves for drawing curved shapes.

Generalization

The Bézier curve of degree n can be generalized as follows. Given points P0, P1,..., Pn, the Bézier curve is

\mathbf{B}(t)=\sum_{i=0}^n {n\choose i}(1-t)^{n-i}t^i\mathbf{P}_i =(1-t)^n\mathbf{P}_0+{n\choose 1}(1-t)^{n-1}t\mathbf{P}_1+\cdots+t^n\mathbf{P}_n \mbox{ , } t \in [0,1].

For example, for n=5:

\mathbf{B}(t)=(1-t)^5\mathbf{P}_0+5t(1-t)^4\mathbf{P}_1+10t^2(1-t)^3\mathbf{P}_2+10t^3(1-t)^2\mathbf{P}_3+5t^4(1-t)\mathbf{P}_4+t^5\mathbf{P}_5 \mbox{ , } t \in [0,1].

This formula can be expressed recursively as follows: Let \mathbf{B}_{\mathbf{P}_0\mathbf{P}_1\ldots\mathbf{P}_n} denote the Bézier curve determined by the points P0, P1,..., Pn. Then

\mathbf{B}(t) = \mathbf{B}_{\mathbf{P}_0\mathbf{P}_1\ldots\mathbf{P}_n}(t) = (1-t)\mathbf{B}_{\mathbf{P}_0\mathbf{P}_1\ldots\mathbf{P}_{n-1}}(t) + t\mathbf{B}_{\mathbf{P}_1\mathbf{P}_2\ldots\mathbf{P}_n}(t)

In words, the degree n Bézier curve is a linear interpolation between two degree n-1 Bézier curves.

Terminology

Some terminology is associated with these parametric curves. We have

\mathbf{B}(t) = \sum_{i=0}^n \mathbf{b}_{i,n}(t)\mathbf{P}_i,\quad t\in[0,1]

where the polynomials

\mathbf{b}_{i,n}(t) = {n\choose i} t^i (1-t)^{n-i},\quad i=0,\ldots n

are known as Bernstein basis polynomials of degree n, defining t0 = 1 and (1 - t)0 = 1.

The points Pi are called control points for the Bézier curve. The polygon formed by connecting the Bézier points with lines, starting with P0 and finishing with Pn, is called the Bézier polygon (or control polygon). The convex hull of the Bézier polygon contains the Bézier curve.

Constructing Bézier curves

Linear curves

Animation of a linear Bézier curve, t in [0,1]
Animation of a linear Bézier curve, t in [0,1]

The t in the function for a linear Bézier curve can be thought of as describing how far B(t) is from P0 to P1. For example when t=0.25, B(t) is one quarter of the way from point P0 to P1. As t varies from 0 to 1, B(t) describes a curved line from P0 to P1.

Quadratic curves

For quadratic Bézier curves one can construct intermediate points Q0 and Q1 such that as t varies from 0 to 1:

Construction of a quadratic Bézier curve Animation of a quadratic Bézier curve, t in [0,1]
Construction of a quadratic Bézier curve Animation of a quadratic Bézier curve, t in [0,1]

Higher-order curves

For higher-order curves one needs correspondingly more intermediate points. For cubic curves one can construct intermediate points Q0, Q1 & Q2 that describe linear Bézier curves, and points R0 & R1 that describe quadratic Bézier curves:

Construction of a cubic Bézier curve Animation of a cubic Bézier curve, t in [0,1]
Construction of a cubic Bézier curve Animation of a cubic Bézier curve, t in [0,1]

For fourth-order curves one can construct intermediate points Q0, Q1, Q2 & Q3 that describe linear Bézier curves, points R0, R1 & R2 that describe quadratic Bézier curves, and points S0 & S1 that describe cubic Bézier curves:

Construction of a quartic Bézier curve Animation of a quartic Bézier curve, t in [0,1]
Construction of a quartic Bézier curve Animation of a quartic Bézier curve, t in [0,1]

(See also a construction of a fifth-order Bezier curve.)

Polynomial form

Sometimes it is desirable to express the Bézier curve as a polynomial instead of a sum of less straightforward Bernstein polynomials. Application of the binomial theorem to the definition of the curve followed by some rearrangement will yield:

\mathbf{B}(t) = \sum_{j = 0}^n {t^j \mathbf{C}_j}

where

\mathbf{C}_j = \frac{n!}{(n - j)!} \sum_{i = 0}^j \frac{(-1)^{i + j} \mathbf{P}_i}{i! (j - i)!} = \prod_{m = 0}^{j - 1} (n - m) \sum_{i = 0}^j \frac{(-1)^{i + j} \mathbf{P}_i}{i! (j - i)!} .

This could be practical if \mathbf{C}_j can be computed prior to many evaluations of \mathbf{B}(t); however one should use caution as high order curves may lack numeric stability (de Casteljau's algorithm should be used if this occurs). Note that the product of no numbers is 1.

Rational Bézier curves

The rational Bézier adds adjustable weights to provide closer approximations to arbitrary shapes. The numerator is a weighted Bernstein-form Bézier curve and the denominator is a weighted sum of Bernstein polynomials.

Given n + 1 control points Pi, the rational Bézier curve can be described by:

\mathbf{B}(t) = \frac{ \sum_{i=0}^n b_{i,n}(t) \mathbf{P}_{i}w_i } { \sum_{i=0}^n b_{i,n}(t) w_i }

or simply

\mathbf{B}(t) = \frac{ \sum_{i=0}^n {n \choose i} t^i (1-t)^{n-i}\mathbf{P}_{i}w_i } { \sum_{i=0}^n {n \choose i} t^i (1-t)^{n-i}w_i }.

See also

References

External links