Bézier Curves & Surfaces Glenn G. Chappell U. of Alaska Fairbanks CS 481/681 Lecture Notes Monday, March 1, 2004

1 Mar 2004CS 481/6812 Review: Object Descriptions Speed in the right-hand step is generally more important than speed in the left-hand step. (Why?) Thus, we typically use explicit descriptions. We put lots of work into making these easy to create & modify. This is what splines are all about. Idea Surface Description Polygon List & Rendered Image This part can be tricky when using explicit descriptions. This part can be tricky when using implicit descriptions.

1 Mar 2004CS 481/6813 Review: Curves/Concepts for Splines [1/4] Drawing curves is an important topic in CG. Remember: Think of a curve as a curve, not as a list of points (even though it is drawn that way). We looked at how to draw circles, but circles are not general enough for our needs. For the next few class meetings, we will be looking at curves called splines. Last time, we discussed some background issues, which we will now briefly review. Parametric curves. Curves in pieces. Polynomials. Curve-design user interface (and control points).

1 Mar 2004CS 481/6814 Review: Concepts for Splines [2/4] A (2-D) parametric curve is expressed as: A pair of (mathematical) functions: P(t) = ( x(t), y(t) ). In 3-D, we add a third function for z. And an interval of legal values for t: [a,b]. t is called the parameter. Example: x(t) = t 2 –2t, y(t) = t–1, t in [0,3]. x y t = 0 (start) (t 2 –2t, t–1) t = 3 (end)

1 Mar 2004CS 481/6815 Review: Concepts for Splines [3/4] We like parametric curves because: Every curve can be described as a parametric curve. A parameterization converts naturally into code to draw the curve. A parameterization is also a useful description of a motion. In this case, the parameter usually represents time (thus, “t”). We want to be able to describe a curve in pieces. This avoids complex formulas, speeds computation, reduces error. But smoothness becomes an issue: pieces must fit together nicely. We like our formulas to involve only polynomials. They can be stored compactly. Values can be calculated quickly & accurately. Other computations (e.g., derivatives) are simple. 

1 Mar 2004CS 481/6816 Review: Concepts for Splines [4/4] A good user interface for curve design involves control points. Example control points. Curves can be interpolating or approximating. Using control points allows convenient editing of curves, as well as specification of motions (camera paths, etc.). P1P1 P0P0 P2P2 P3P3 P0P0 P2P2 P3P3 P1P1 P0P0 P2P2 P3P3 P1P1 P1P1

1 Mar 2004CS 481/6817 Bézier Curves & Surfaces: Introduction The first type of spline used in CAD/CAM was the Bézier curve. Say “BAY-zee-AY”. The “r” is not pronounced. Bézier curves were developed in the 1960’s, independently, by Pierre Bézier and Paul de Casteljau. The first application was automobile design. Bézier was at Renault, and de Casteljau was at Citroën. Bézier curves and Bézier surfaces are still widely used today. PostScript and TrueType both describe characters with Bézier curves. Bézier curves & surfaces are built into OpenGL (as “evaluators”). A Bézier curve is a parametric curve described by polynomials based on control points. Any number of control points may be used. 3 & 4 are common. Degree of polynomials = number of points – 1. Several Bézier curves can easily be glued together in a way that makes the curve as a whole smooth. Bézier curves are approximating curves. A Bézier curve passes through its first and last control points, but, in general, no others.

1 Mar 2004CS 481/6818 Bézier Curves & Surfaces: Overview We will cover the following topics. What is a Bézier curve? What is a Bézier surface? How are Bézier curves/surfaces drawn in OpenGL? Evaluators. Drawing Bézier curves/surfaces. Bernstein polynomials. The de Casteljau Algorithm. Properties of Bézier curves. Both good & not-so-good.

1 Mar 2004CS 481/6819 Bézier Curves & Surfaces: Curves [1/3] We are given n control points: P 0, P 1, …, P n–1. The Bézier curve defined by these control points is a parametric curve described by polynomials of degree n–1. The interval for the parameter is [0,1]. We will think of the curve as a single function f: given a number, it returns a point. First case: 2 control points (P 0, P 1 ). f(0) = P 0 ; f(1) = P 1. To find other function values, lirp. The resulting Bézier curve is a line segment. P0P0 P1P1

1 Mar 2004CS 481/68110 Bézier Curves & Surfaces: Curves [2/3] Next case: 3 control points (P 0, P 1, P 2 ). f(0) = P 0 (first control pt.); f(1) = P 2 (last control pt.). To find other function values (for a given value of t): Lirp between P 0 & P 1. Lirp between P 1 & P 2 (same t). Lirp between above two values (same t) to get point on curve. The resulting Bézier curve is part of a parabola. P0P0 P1P1 P2P2 P0P0 P1P1 P2P2

1 Mar 2004CS 481/68111 Bézier Curves & Surfaces: Curves [3/3] Next case: 4 control points (P 0, P 1, P 2, P 3 ). f(0) = P 0 (first control pt.); f(1) = P 3 (last control pt.). To find other function values (for a given value of t): Lirp between P 0 & P 1, P 1 & P 2, and P 2 & P 3. Lirp between 1 st & 2 nd point above and between 2 nd & 3 rd. Lirp between the above two values to get the point on the curve. For more control points, continue this procedure. This is not a terribly efficient way to draw a Bézier curve. More on this later. P0P0 P1P1 P2P2 P3P3

1 Mar 2004CS 481/68112 Bézier Curves & Surfaces: Surfaces To define a Bézier surface: Think of a rectangular grid of control points. Draw Bézier curves horizontally. Use each row as the control points for its own Bézier curve. Then draw Bézier curves vertically. Corresponding points on the existing curves are the control points. The last curves drawn form the Bézier surface. Good time for a blackboard picture. Such a picture was, indeed, drawn.

1 Mar 2004CS 481/68113 OpenGL Evaluators: Introduction OpenGL includes Bézier-curve computation and drawing, in the form of evaluators. When you use an evaluator, you specify the control points and the usual drawing state (color, points or lines, etc.), but OpenGL does the glVertex … commands for you. Some example code using evaluators can be found in simpleevaluator.cpp and evaluator.cpp, on the web page. Also see bezcurve.c, in the Example Programs directory. We now look at how to use an evaluator. Most of our code comes from simpleevaluator.cpp.

1 Mar 2004CS 481/68114 OpenGL Evaluators: Usage [1/3] Control points are specified in an array. const int numcontrolpts = 4; // No. of control pts // Below are coord 's of control pts. GLfloat controlpts[numcontrolpts][3] = { {-0.9, -0.9, 0.0}, {-0.5, 0.2, 0.0}, { 0.9, -0.9, 0.0}, { 0.9, 0.9, 0.0} }; 2-D points are not an option; z-coordinates are required.

1 Mar 2004CS 481/68115 OpenGL Evaluators: Usage [2/3] We initialize an evaluator using glMap1 …. glMap1f(GL_MAP1_VERTEX_3, // target: 1-d [curve], // 3 coord's per pt 0.0, 1.0, // start & end param value 3, // "stride": pts stored // 3 GLfloat's apart numcontrolpts, // no. of control points &controlpts[0][0]); // control pt data We enable an evaluator using glEnable (like textures). glEnable(GL_MAP1_VERTEX_3); // Enable this evaluator

1 Mar 2004CS 481/68116 OpenGL Evaluators: Usage [3/3] To do a “ glVertex …” for a point on a Bézier curve, use glEvalCoord1 …. One argument: the parameter of the Bézier curve (“t”). Thus, we can draw the whole curve as follows. Assume numdrawsegs is the number of line segments to use. glBegin(GL_LINE_STRIP); for (int i=0; i<=numdrawsegs; ++i) { GLdouble t = GLdouble(i)/numdrawsegs; glEvalCoord1d(t); } glEnd();

1 Mar 2004CS 481/68117 OpenGL Evaluators: Evaluator Grids [1/2] To simplify things even further, OpenGL allows you to specify a grid of parameter values. Use function glMapGrid1 …. This has 3 arguments: The number of line segments to draw. Starting parameter value. Ending parameter value. For example, to draw the same curve using an evaluator grid, we would do the following. glMapGrid1d(numdrawsegs, 0.0, 1.0); Note: If the number of segments changes, just call glMapGrid1 … again. You need not reinitialize the evaluator.

1 Mar 2004CS 481/68118 OpenGL Evaluators: Evaluator Grids [2/2] To draw using an evaluator grid, use glEvalMesh1. This has 3 arguments: What to draw: GL_LINE or GL_POINT. Starting point in the mesh (usually 0). How many segments (usually same as 1 st argument to glMapGrid1 …). Thus, the for -loop used earlier can be replaced by a single function call: glEvalMesh1(GL_LINE, 0, numdrawsegs);

1 Mar 2004CS 481/68119 OpenGL Evaluators: Surfaces Each evaluator command with a “ 1 ” in its name has a corresponding command with a “ 2 ”, for Bézier surfaces. The number of parameters changes in various appropriate ways. See the OpenGL doc’s. When you use evaluators to draw Bézier surfaces, OpenGL can compute vertex normals for you. Do “ glEnable(GL_AUTO_NORMAL); ” This only works with evaluator-generated Bézier surfaces, for some reason.

1 Mar 2004CS 481/68120 OpenGL Evaluators: Notes If you write your code in the form I have presented, then modifications are both rare and easy. In particular: Keep the number of control points in a variable. Keep the number of segments to draw in a variable. Store the number of segments to draw, not the number of points (even if you are drawing points!), or you’ll get zillions of one-off errors. Always start your parameter at 0 and end at 1, and you’ll never wonder where it starts and ends.