# Bézier curves

Bézier curves are widely used in computer graphics to generate animation paths, smooth interpolations between values, modeling of shapes and so on. Below, a general way to compute Bézier curves of arbitrary degree is shown in Casteljau’s algorithm, and after that, the explicit equations for solving Bézier curves of degree 1, 2 and 3 are given.

## Casteljau’s algorithm

In the following chunk of code we can see how computeBezierPoints generates n points belonging to the curve defined by a list of points controlPoints.

 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657 // It generates the point at time t in the bezier // curve by recursively interpolating line segments vec2 interpolate(   float t, // Time   size_t ini, // First control point to interp.   size_t end, // Last control point to interp.   const vector &controlPoints) {   if (ini == end -1) {     // Base case     const vec2 &p1( controlPoints[ini] );     const vec2 &p2( controlPoints[end] );     return p1 + (p2-p1)*t;   } else {     // interpolate the curve (without     // the last control point)     const vec2 p1 = interpolate(                       t,                       ini,                       fin-1,                       controlPoints);     // interpolate the curve (without     // the first control point)     const vec2 p2 = interpolate(                       t,                       ini+1,                       fin,                       controlPoints);     return p1 + (p2-p1)*t;   } } // It generates n points in the bezier curve vector computeBezierPoints(   size_t n, // Number of points generated   const vector &controlPoints) {   vector curvePoints;   // Check: at least two control points   if (n >= 2 && controlPoints.size() >= 2) {     size_t ini = 0;     size_t end = controlPoints.size() - 1;     // Generate n points     for (size_t i = 0; i < n; ++i) {       float t = static_cast(i)/(n-1);       vec2 point = interpolate(                       t,                       ini,                       end,                       controlPoints);                       curvePoints.push_back(point);     }   }   return curvePoints; }    Bézier curves: 1. lineal; 2. quadratic; 3. cubic; 4. quartic. Images taken from Wikipedia.org

For a better explanation of Casteljau’s algorithm see Bezier curve in Wikipedia.

## Linear Bezier Curves (2 points)

The special case where there are only two control points is a straight line.

 123456 // It calculates a point in the bezier curve at the // time t. c1 and c2 are the 2 control points vec2 bezier1(float t, const vec2 &c1, const vec2 &c2) {   return (1-t)*c1 + t*c2; }

## Quadratic Bezier Curves (3 points)

The special case where there are three control points is a smooth curve whose points are calculated with the next function.

 12345678910 // It calculates a point in the bezier curve at the // time t. c1, c2 and c3 are the control points vec2 bezier2(   float t,   const vec2 &c1,   const vec2 &c2,   const vec2 &c3) {   return (1-t)^2*c1 + 2*(1-t)*t*c2 + t^2*c3; }

## Cubic Bezier Curves (4 points)

Finally, the function to compute points of a Bézier curve of degree 3.

 1234567891011121314 // It calculates a point in the bezier curve at the // time t. c1, c2, c3 and c4 are the control points vec2 bezier3(   float t,   const vec2 &c1,   const vec2 &c2,   const vec2 &c3,   const vec2 &c4) { return   (1-t)^3*c1 +        3*(1-t)^2*t*c2 +        3*(1-t)  *t^2*c3 +                  t^3c4; }