![Page 1: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/1.jpg)
Parametric Curves & Surfaces
Introduction to Computer GraphicsCSE 470/598
Arizona State University
Dianne Hansford
![Page 2: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/2.jpg)
Overview
• What is a parametric curve/surface?• Why use parametric curves &
surfaces?• Bézier curves & surfaces• NURBS• Trimmed surfaces• OpenGL library
![Page 3: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/3.jpg)
What is a parametric curve?
Recall functions from calculus ...
Example: y = 2x – 2x2
Parametric curvesgive us more flexibility
xy
=x2x – 2x2
To illustrate, weplot graph of function
![Page 4: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/4.jpg)
What is a parametric curve?
2D parametric curve takes the form
xy
f(t)g(t)
Where f(t) and g(t)are functions of t
=
Example: Line thru points a and b
xy
(1-t) ax + t bx
(1-t) ay+ t by
=
Mapping of the real line to 2D: here t in [0,1] line segment a,b
![Page 5: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/5.jpg)
What is a parametric curve?
3D curves defined similarly
xyz
f(t)g(t)h(t)
=
Example: helix
xyz
cos(t)sin(t)t
=
![Page 6: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/6.jpg)
Bézier Curves
Polynomial parametric curvesf(t), g(t), h(t) are polynomial functions
Bézier curve b(t)
Bézier control points bi
Bézier polygon
Curve mimics shape of polygon
t in [0,1] maps to curve “between” polygon
b(0) = b0 and b(1) = bn
figure: degree n=3 (cubic)
![Page 7: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/7.jpg)
Bézier CurvesExamples
linear: b(t) = (1-t) b0 + t b1
quadratic: b(t) = (1-t)2 b0 + 2(1-t)t b1 + t2
b2cubic: b(t) = (1-t)3 b0 + 3(1-t)2 t b1
+ 3(1-t)t2 b2 + t3 b3
Bernstein basis Bin (t) = {n!/(n-i)! i!} (1-t)n-i ti
n=1
n=2
n=3
![Page 8: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/8.jpg)
Bézier Curves
![Page 9: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/9.jpg)
Bézier Curves
Bézier points and Bernstein basis
Nice, intuitive method to create curves Variable display resolutionMinimal storage needs
![Page 10: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/10.jpg)
Bézier Curves
Bézier points and Bernstein basis
Monomial basis: 1, t, t2, t3 ,....
ex: quadratic a(t) = a0 + t a1 + t2 a2
a0 is point on curve
a1 is first derivative vector
a2 is second derivative vector
Not very practical to design curves with!
nice, intuitive method to create curves
Compare to
at t=0
![Page 11: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/11.jpg)
Bézier Curves
local and global parameter intervals
Piecewise Bézier curves global parameter u e.g., time
[u0,u1]
[u1,u2]
Each curve evaluated for t in [0,1]
If specify u in global spacethen must find t in local space
t = (u-u0) / (u1-u0)figure: 2 quadratic curves
![Page 12: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/12.jpg)
Bézier Curves
Piecewise Bézier curves
Conditions to create a smooth transition
Filled squares are “junction” Bezier points-- start/endpoint of a curve
![Page 13: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/13.jpg)
Bézier Curves in OGL
Basic steps:
Define curve by specifying degree, control points and parameter space [u0,u1]
Enable evaluatorCall evaluator with parameter u in [u0, u1]
Specify each u:glEvalCoord1*()
Autocreate uniformly spaced u:glMapGrid1*()glEvalMesh1()
glMap1*()
or
Color and texture available too!
![Page 14: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/14.jpg)
Bézier Curve Evaluation
de Casteljau algorithmanother example of repeated subdivision
On each polygon leg,construct a point in theratio t : (1-t)
bn0(t) is point on
curvefigure: n=3
![Page 15: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/15.jpg)
What is a parametric surface?
3D parametric surface takes the form
xyz
f(u,v)g(u,v)h(u,v)
Where f,g,h are bivariate functions of u and v
=
mapping u,v-space to 3-space;this happens to be a function too
Example: x(u,v) =
uv
u2 + v2
![Page 16: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/16.jpg)
Bézier Surface (Patch)Polynomial parametric surface
f(u,v), g(u,v), h(u,v) are polynomial functions written in the Bernstein basis
Bézier surface b(u,v)
Bézier control points bij
Bézier control net
![Page 17: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/17.jpg)
Bézier Surface
Structure
v
(0,0)
u
(1,1)
b00
b33
b30
b03
uv
![Page 18: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/18.jpg)
Bézier Surface
Properties
boundary curveslie on surface
boundary curvesdefined by boundary polygons
![Page 19: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/19.jpg)
Bézier Surface
Properties
Nice, intuitive method for creating surfaces
Variable display resolution
Minimal storage
![Page 20: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/20.jpg)
Bézier Surface
Multiple patches connected smoothly
Conditions on control netsimilar to curves …difficult to do manually
![Page 21: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/21.jpg)
Bézier Surface
Display
wireframe shaded
choose directionisoparametric curves
OGL: glMap2*, glEvalCoord2*
glMapGrid2, glEvalMesh2
OGL: triangles & normalscreated for you
![Page 22: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/22.jpg)
NURBS
Non-uniform Rational B-splines
B-splines are piecewise polynomialsOne or more Bezier curves /surfacesOne control polygon
Rational: let’s us represent circles exactly
GLU NURBS utility
![Page 23: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/23.jpg)
Trimmed SurfacesParametric surface with parts of the
domain “invisible”
Jorg Peters’ UFL group
GLU Trimmed NURBS utility
Surf
Lab
domain
![Page 24: Parametric Curves & Surfaces Introduction to Computer Graphics CSE 470/598 Arizona State University Dianne Hansford](https://reader030.vdocuments.site/reader030/viewer/2022033104/56649dcf5503460f94ac4558/html5/thumbnails/24.jpg)
References
The Essentials of CAGDby Gerald Farin & DCH, AK Petershttp://eros.cagd.eas.asu.edu/%7Efarin/essbook/essbook.html
Ken Joy’s CAGD notes (UC Davis)http://graphics.cs.ucdavis.edu/CAGDNotes/homepage.html
Jorg Peters’ UFL SurfLab grouphttp://www.cise.ufl.edu/research/SurfLab/index.html
OpenGL Red Book – Chapter 12