1. MAE 152 Computer Graphics for Scientists and Engineers
Splines and Bezier Curves

2. Introduction |Representing Curves Interpolation Parametric equations
A number of small line-segments joined
Interpolation
Parametric equations
Types of curve we study
Natural Cubic Splines and Bezier Curves
Derivation
Implementation

3. “Computers can’t draw curves.”
The more points/line segments that are used, the smoother the curve.

4. Why have curves ? Representation of “irregular surfaces”
Example: Auto industry (car body design)
Artist’s representation
Clay / wood models
Digitizing
Surface modeling (“body in white”)
Scaling and smoothening
Tool and die Manufacturing

5. Curve representation
Problem: How to represent a curve easily and efficiently
“Brute force and ignorance” approaches:
storing a curve as many small straight line segments
doesn’t work well when scaled
inconvenient to have to specify so many points
need lots of points to make the curve look smooth
working out the equation that represents the curve
difficult for complex curves
moving an individual point requires re-calculation of the entire curve

6. Solution - Interpolation
Define a small number of points
Join the points with a series of (short) straight lines
Use a technique called “interpolation” to invent the extra points for us.

7. The need for smoothness
So far, mostly polygons
Can approximate any geometry, but
Only approximate
Need lots of polygons to hide discontinuities
Storage problems
Math problems
Normal direction
Texture coordinates
Not very convenient as modeling tool
Gets even worse in animation
Almost always need smooth motion

8. Geometric modeling Representing world geometry in the computer
Discrete vs. continuous again
At least some part has to be done by a human
Will see some automatic methods soon
Reality: humans are discrete in their actions
Specify a few points, have computer create something which “makes sense”
Examples: goes through points, goes “near” points

9. Requirements Want mathematical smoothness Local control
Some number of continuous derivatives of P
Local control
Local data changes have local effect
Continuous with respect to the data
No wiggling if data changes slightly
Low computational effort

10. A solution Use SEVERAL polynomials
Complete curve consists of several pieces
All pieces are of low order
Third order is the most common
Pieces join smoothly
This is the idea of spline curves
or just “splines”

11. Parametric Equations - linear
Walk from P0 to P1 at a constant speed.
Start from P0 at t=0
Arrive at P1 at t=1
dx = x1 - x0
dy = y1 - y0
Where are you at a general time t?
x(t) = x0 + t.dx
y(t) = y0 + t.dy
Equation(s) of a straight line as a function of an arbitrary parameter t.

12. Let us just confirm that
Question Where are you at t=0.5?
dx = = 11
dy = = 5
x(0.5) = 2 + ( ) = 7.5
y(0.5) = 3 + (0.5 .5) = 5.5
Answer: You’ll be halfway there.

13. Why use parametric equations?
One, two, three or n-dimensional representation is possible
Can handle “infinite slope” of tangents
Can represent multi-valued functions

14. For this class …
Natural Cubic Spline
Bezier Curves

15. Splines Define the “knots” Calculate all other points
(x0,y0) - (x3,y3)
Calculate all other points

16. Continuity Parametric continuity Cx Geometric continuity Gx
Only P is continuous: C0
Positional continuity
P and first derivative dP/du are continuous: C1
Tangential continuity
P + first + second: C2
Curvature continuity
Geometric continuity Gx
Only directions have to match

17. Order of continuity
(a)
(b)
(c)

18. Wiggling effect Example:
Four data points
Third degree polynomial
Might look something like:
This the ONLY third degree polynomial which fits the data
Wiggling gets much worse with higher degree

19. Polynomial parametric equations
To represent a straight line - linear parametric equation (i.e. one where the highest power of t was 1).
For curves, we need polynomial equations. Why? Because the graphs of polynomial equations wiggle!

20. Natural Cubic Spline
spline, n. 1 A long narrow and relatively thin piece or strip of wood, metal, etc. 2 A flexible strip of wood or rubber used by draftsmen in laying out broad sweeping curves, as in railroad work.
A natural spline defines the curve that minimizes the potential energy of an idealized elastic strip.

21. A natural cubic spline defines a curve, in which the points P(u) that define each segment of the spline are represented as a cubic P(u) = a0 + a1u + a2u2 + a3u3
Where u is between 0 and 1 and a0, a1, a2 and a3 are (as yet) undetermined parameters.
We assume that the positions of n+1 control points Pk, where k = 0, 1,…, n are given, and the 1st and 2nd derivatives of P(u) are continuous at each interior control point.

22. (a)
(b)

23. Why cubic? Undesirable wiggles and oscillations for higher orders
The lowest order polynomials to satisfy the following conditions
Caution! Heavy math ahead!

24. A parametrically defined curve
Parameterization
A parametrically defined curve

25. “Re-parameterization”
non-uniform

26. Interpolation versus Approximation

27. Hermite Interpolation1 2 3 4 5

28. Hermite Spline Say the user provides
A cubic spline has degree 3, and is of the form:
For some constants a, b, c and d derived from the control points, but how?
We have constraints:
The curve must pass through x0 when t=0
The derivative must be x’0 when t=0
The curve must pass through x1 when t=1
The derivative must be x’1 when t=1

29. How to specify slope Di

30. Hermite Spline
A Hermite spline is a curve for which the user provides:
The endpoints of the curve
The parametric derivatives of the curve at the endpoints
The parametric derivatives are dx/dt, dy/dt, dz/dt
That is enough to define a cubic Hermite spline, more derivatives are required for higher order curves

31. Hermite Spline
Solving for the unknowns gives:
Rearranging gives: or

32. Hermite curves in 2D and 3D
We have defined only 1D splines:
x = f(t:x0,x1,x’0,x’1)
For higher dimensions, define the control points in higher dimensions (that is, as vectors)

33. Basis Functions
A point on a Hermite curve is obtained by multiplying each control point by some function and summing
The functions are called basis functions

34. Hermite and Cubic Spline Interpolation
An interpolating cubic spline

35. need two more Eq’s to determine all coefficients
Spline Interpolation
need two more Eq’s to determine all coefficients
Natural Spline

36. Deriving Natural Cubic Splines

37. Tri-Diagonal Matrix for Natural Cubic Spline

39. Other End Condition

41. B A

42. Knot Spacing
(0,1,2,3,4,5)
(0,1,2,6,7,8)

43. Euclidean Distance

44. Closed Curves
Homework

45. Bezier Curves An alternative to splines
M. Bezier was a French mathematician who worked for the Renault motor car company.
He invented his curves to allow his firm’s computers to describe the shape of car bodies.

46. Bezier Approximation

47. Bezier curves Typically, cubic polynomials
Similar to Hermite interpolation
Special way of specifying end tangents
Requires special set of coefficients
Need four points
Two at the ends of a segment
Two control tangent vectors

48. Bezier curves Control polygon: control points connected to each other
Easy to generalize to higher order
Insert more control points
Hermite – third order only

49. De Casteljau algorithm
Can compute any point on the curve in a few iterations
No polynomials, pure geometry
Repeated linear interpolation
Repeated order of the curve times
The algorithm can be used as definition of the curve

50. De Casteljau algorithm
Third order, u=0.75

51. De Casteljau algorithm

52. De Casteljau algorithm

53. De Casteljau algorithm

54. De Casteljau Algorithm

55. What does it mean ? 1

56. Bezier Polynomial Function

57. Parametric equations for x(t),y(t)

58. Some Bezier Curves

59. Bezier Curves - properties
Not all of the control points are on the line
Some just attract it towards themselves
Points have “influence” over the course of the line
“Influence” (attraction) is calculated from a polynomial expression
(show demo applet)

60. Convex Hull property

61. Bezier Curve Properties
The first and last control points are interpolated
The tangent to the curve at the first control point is along the line joining the first and second control points
The tangent at the last control point is along the line joining the second last and last control points
The curve lies entirely within the convex hull of its control points
The Bernstein polynomials (the basis functions) sum to 1 and are everywhere positive
They can be rendered in many ways
E.g.: Convert to line segments with a subdivision algorithm

62. Disadvantages The degree of the Bezier curve depends on the
number of control points.
The Bezier curve lacks local control. Changing
the position of one control point affects the entire
curve.

63. Invariance
Translational invariance means that translating the control points and then evaluating the curve is the same as evaluating and then translating the curve
Rotational invariance means that rotating the control points and then evaluating the curve is the same as evaluating and then rotating the curve
These properties are essential for parametric curves used in graphics
It is easy to prove that Bezier curves, Hermite curves and everything else we will study are translation and rotation invariant

64. Longer Curves
A single cubic Bezier or Hermite curve can only capture a small class of curves
At most 2 inflection points
One solution is to raise the degree
Allows more control, at the expense of more control points and higher degree polynomials
Control is not local, one control point influences entire curve
Alternate, most common solution is to join pieces of cubic curve together into piecewise cubic curves
Total curve can be broken into pieces, each of which is cubic
Local control: Each control point only influences a limited part of the curve
Interaction and design is much easier

65. Piecewise Bezier Curve
“knot”
P0,0
P1,3
P0,3
P1,0
P1,2
P1,1

66. Continuity
When two curves are joined, we typically want some degree of continuity across the boundary (the knot)
C0, “C-zero”, point-wise continuous, curves share the same point where they join
C1, “C-one”, continuous derivatives, curves share the same parametric derivatives where they join
C2, “C-two”, continuous second derivatives, curves share the same parametric second derivatives where they join
Higher orders possible
Question: How do we ensure that two Hermite curves are C1 across a knot?
Question: How do we ensure that two Bezier curves are C0, or C1, or C2 across a knot?

67. Achieving Continuity
For Hermite curves, the user specifies the derivatives, so C1 is achieved simply by sharing points and derivatives across the knot
For Bezier curves:
They interpolate their endpoints, so C0 is achieved by sharing control points
The parametric derivative is a constant multiple of the vector joining the first/last 2 control points
So C1 is achieved by setting P0,3=P1,0=J, and making P0,2 and J and P1,1 collinear, with J-P0,2=P1,1-J
C2 comes from further constraints on P0,1 and P1,2

68. Bezier Continuity P0,0 P0,1 P0,2 J P1,1 P1,2 P1,3
Disclaimer: PowerPoint curves are not Bezier curves, they are interpolating piecewise quadratic curves! This diagram is an approximation.

69. DOF and Locality
The number of degrees of freedom (DOF) can be thought of as the number of things a user gets to specify
If we have n piecewise Bezier curves joined with C0 continuity, how many DOF does the user have?
If we have n piecewise Bezier curves joined with C1 continuity, how many DOF does the user have?
Locality refers to the number of curve segments affected by a change in a control point
Local change affects fewer segments
How many segments of a piecewise cubic Bezier curve are affected by each control point if the curve has C1 continuity?
What about C2?

70. Geometric Continuity Derivative continuity is important for animation
If an object moves along the curve with constant parametric speed, there should be no sudden jump at the knots
For other applications, tangent continuity might be enough
Requires that the tangents point in the same direction
Referred to as G1 geometric continuity
Curves could be made C1 with a re-parameterization
The geometric version of C2 is G2, based on curves having the same radius of curvature across the knot
What is the tangent continuity constraint for a Bezier curve?

71. Bezier Geometric Continuity
P0,1
P0,2
P0,0
P1,3 J
P1,1
P1,2

72. Problem with Bezier Curves
To make a long continuous curve with Bezier segments requires using many segments
Maintaining continuity requires constraints on the control point positions
The user cannot arbitrarily move control vertices and automatically maintain continuity
The constraints must be explicitly maintained
It is not intuitive to have control points that are not free

73. Bezier Basis Functions for d=3

74. Bezier Curves in OpenGL
OpenGL supports Beziers through mechanism called evaluators used to compute the blending functions, bi (u), of any degree.
Smooth curves and surfaces are drawn by approximating them with large number of small line segments or polygons. Described mathematically by a small number of parameters such as control points.
Evaluator is a way to compute points on a curve or surface using only control points. They do not require uniform spacing of u. Bezier curves can then be rendered at any precision.
1D Bezier curves can also be used to define paths in time for animation

75. Evaluators
A Bezier curve is a vector-valued function of one variable C(u) = [X(u) Y(u) Z(u)] and a Bezier surface patch is a vector-valued function of two variable S(u,v) = [X(u,v) Y(u,v) Z(u,v)]
To use evaluator
first define the function C(u) or S(u,v)
then use the glEvalCoord{12}() command

76. Berstein Polynomial & Bezier Curve

77. One-Dimensional Evaluators
GLfloat ctrlpoints[4][3] = {...};
void init(void) {
glMap1f(GL_MAP1_VERTEX_3, 0.0, 1.0,
3, 4, &ctrlpoints[0][0]); }
void display(void) {
glBegin(GL_LINE_STRIP); for(i=0; i<=30; i++) glEvalCoord1f((GLfloat)i/30.0); glEnd();

78. Defining 1-D Evaluator glMap1(target,u1,u2,stride,order,points);
target: tells what the control points represent
u1,u2: the range of the variable u
stride: the number of floating-point values to advance in the data between one control point and the next
order: the degree plus one, and it should agree with the number of control points
points: pointer to the first coordinate of the first control point

79. Evaluating 1-D Evaluator
glEvalCoord1(u);
glEvalCoord1v(*u);
Causes evaluation of the enabled maps
u: the value of the domain coordinate
More than one evaluator can be defined and evaluated at a time.
(ex) GL_MAP1_VERTEX_3 and GL_MAP1_COLOR_4
In this case, calls to glEvalCoord1() generates both a position and a color.

80. e.g. /* define and enable 1D evaluator for Bezier cubic curve */
point ctrlpts[ ] = { ……. } ;
glMaplf ( GL_MAP1_VERTEX_3, 0.0, 1.0, 3, 4, ctrlpts);
glEnable (GL_MAP1_VERTEX_3);
/* GL_MAP1_VERTEX_3 specifies data type for ctrlpts ,
range of u = [ 0.0, 1.0], 3 is the number of values between control points , (order = degree +1) = */
/* With evaluator enabled, draw line segments for Bezier curve */
 glBegin (GL_LINE_STRIP);
for ( i = 0; i <= 30; i ++)
glEvalCoord1f ( (Glfloat) i/30.0);
glEnd ( )

81. One-Dimensional Grid and Its Eval.
define a one-dimensional evenly spaced grid using glMapGrid1*(), and then evaluate the (part of) grid points using glEvalMesh1()
glMapGrid1(n, u1, u2); defines a grid that goes from u1 to u2 in n steps.
glEvalMesh1(mode, p1, p2); mode: GL_POINT or GL_LINE evaluates from integer indices p1 to p2 with evenly spaced coordinate

82. Bezier Surface

83. Two-Dimensional Evaluators
Everything is similar to the one-dimensional case, except that all the commands must take two parameters, u and v, into account 1. Define evaluator(s) with glMap2*() 2. Enable them with glEnable() 3. Invoke them by calling glEvalCoord2() between a glBegin() and glEnd() or by specifying and applying a mesh with glMapGrid2() and glEvalMesh2()

84. Defining and Evaluating
glMap2(target, u1, u2, ustride, uorder,
v1, v2, vstride, vorder, points);
glEvalCoord2(u, v);
glEvalCoord2v(*values);
Example

85. Grid and Its Evaluation
glMapGrid2(nu, u1, u2, nv, v1, v2);
glEvalMesh2(mode, i1, i2, j1, j2);

86. Using Evaluators for Textures
GLfloat ctrlpoints[4][4][3] = {...};
GLfloat texpts[2][2][2] = {...};
void init(void) { glMap2f(GL_MAP2_VERTEX_3,...,
&ctrlpoints[0][0][0]); glMap2f(GL_MAP2_TEXTURE_COORD_2,...,
&texpts[0][0][0]); glEnable(GL_ MAP2_VERTEX_3); glEnable(GL_MAP2_TEXTURE_COORD_2); glMapGrid2f(...); }
void display(void) { glEvalMesh2(...);

87. End Of Curves