Bézier Curves: Integrating Math, Arts and
Technology
Jomar F. Rabajante
UPLB
Parametric Curves
t
0
1
2
3
x
10
21
2
13
Parametric Curves
t
0
1
2
3
y
1
3
8
2
Parametric Curves
t
0
1
2
3
x
10
21
2
13
y
1
3
8
2
Parametric Curves
x(t )  10  11t  15t (t  1)  10t (t  1)(t  2)
 10t  45t  46t  10
3
2
3
7
y (t )  1  2t  t (t  1)  t (t  1)(t  2)
2
3
 7 3 17 2 25

t  t  t 1
3
2
6
Parametric Curves

Widely used in vector graphics and computeraided designs

Example of Parametric Curve: Bézier curve

Affine transformations on the curve can be
done by just manipulating the “control points”
Bézier Curves



Named after the French engineer Pierre Bézier of the
Renault Automobile Company.
“Free form” curves
Suppose we are given a set of control/Bézier points:
 xi 
pi   
 yi 
Bézier Curves

We can generate a curve using the parametric form
(Bernstein representation):
 x (t ) 
P (t )  
, 0  t 1

 y (t )
n
n
n i i
   (1  t ) t pi
i 0  i 
Familiar?
Bézier Curves

For 3 points (Quadratic Bézier):
2
0
x(t )  (1  t ) x  2(1  t )(t ) x1  t x2
2
y (t )  (1  t ) y0  2(1  t )(t ) y1  t y2
2
2
0  t 1
Notice that if t=0 we get (x0,y0). If t=1 we get (x2,y2).
As t takes on values between 0 & 1, a curve is traced but it
may not pass through the central point.
Source: Wikipedia
Bézier Curves

For 4 points (Cubic Bézier):
x(t )  (1  t ) x0  3(1  t ) (t ) x1 
3
2
3(1  t )(t ) x2  t x3
2
3
y (t )  (1  t ) y0  3(1  t ) (t ) y1 
3
2
3(1  t )(t ) y2  t y3
2
0  t 1
3
You can use MS Excel, GraphCalc or any
graphing software…
TO DO:
3.5
3
2.5
2
1.5
1
0.5
0
0
1
2
3
4
5
6
The following control points are used:
5,2 , 1,5 , 1,1 and (5,3).
𝑥 𝑡 = 5(1 − 𝑡)3 + 3(1 − 𝑡)2 𝑡 + 3(1 − 𝑡)𝑡 2 + 5𝑡 3 , 0 ≤ 𝑡 ≤ 1
𝑦 𝑡 = 2(1 − 𝑡)3 + 15(1 − 𝑡)2 𝑡 + 3(1 − 𝑡)𝑡 2 + 3𝑡 3 , 0 ≤ 𝑡 ≤ 1
Bézier Curves

The Bézier curve lies entirely inside the convex hull
containing all the control points.
Convex hull of a set of points is the smallest convex set that
contains the points. A set is convex iff the line segment
between any two points in the set lies entirely in the set.
Examples of convex hull of four points:
Bézier Curves
 Some
curves that seem simple, such as
the circle, cannot be described exactly by a
Bézier or piecewise Bézier curve;
RATIONAL BEZIER curves can do this.
de Casteljau’s Algorithm

Independently made by Paul de Faget de Casteljau to
generate Bézier curves.

Uses barycenter coordinates.

Let’s use Geogebra
Bézier Curves: Integrating Math, Arts and
Technology
Jomar F. Rabajante
UPLB