Computer Graphics CSI4130 Winter 2019
Jochen Lang
EECS, University of Ottawa Canada
Drawing Curves and Surfaces
Need a mathematical representation in order to draw in 2D and 3D, or we want more than points
Examples lines
curves planes triangles
CSI4130 Computer Graphics
Curve Representations
Explicit representation Curve as a function
,0
Implicit representation
Curve as the zero-set of a function
Parametric representation Use of a free parameter
CSI4130 Computer Graphics
2D Implicit Curves
Equation of a particular form:
Consider a circle at the origin:
Translate circle to a center point c
Implicit Equation:
Write as a vector equation:
CSI4130 Computer Graphics
Implicit Quadric Curves
Quadrics are ellipses and parabolas and include the special cases of hyperbolas, circles and lines.
Example: Circle
CSI4130 Computer Graphics
2D Lines
Line equation
Corresponds to
Poor solution
lines parallel to y-axis have
infinite slope m and no intersect b with y axis
BUT implicit lines only defined up to scale free to choose different parameters
CSI4130 Computer Graphics
Implicit 2D Lines
Chose other parameters
Pick two points (0 and 1) on the line
Implicit lines only defined up to scale, free to choose
CSI4130 Computer Graphics
Implicit 2D Line Equation
Solve system of linear equations
Multiply by denominator
Dot product
CSI4130 Computer Graphics
Distance of a Point from a Line
Use implicit formulation
Signed distance d
CSI4130 Computer Graphics
Gradient
(A, B) is the gradient of the line
In general
Partial derivative reminder
Example:
CSI4130 Computer Graphics
Implicit 3D Curves
Do not exist in the form
Only degenerate cases of implicit surfaces Intersection of 2 surfaces
Often parametric curves are used instead
CSI4130 Computer Graphics
2D Parametric Curves
Curve is controlled by a single parameter Velocity t of the curve
Construct the curve easily
Vector form
Parametric line equation 2 points on the curve
CSI4130 Computer Graphics
Linear Interpolation
In linear interpolation 2 points are connected by a line Parametric line equation
Rewrite as weighted average of 2 points t determines the weight of each point
CSI4130 Computer Graphics
3D Parametric Curve
Parametric curves work in any dimension
Example: Spiral in 3D
CSI4130 Computer Graphics
3D Implicit Surfaces
Same form than implicit 2D curves
Gradient is normal to the surface tangent plane lighting calculations
CSI4130 Computer Graphics
3D Implicit Plane Equation
Vectors in the plane are normal to the plane normal arbitrary point a in the plane
Example: normal by cross product a,b,c 3 non-co-linear points in the plane
Plane equation can be expressed as determinant
CSI4130 Computer Graphics
3D Parametric Surfaces
Carries over from 2D/3D parametric curves but need additional parameter for surface (2D entity vs. 1D)
CSI4130 Computer Graphics
Curves and Surfaces in Three.js
Various parametric curves and surfaces are available Vertex position are generated and meshed for surfaces Surface examples:
SphereGeometry, TorusGeometry, PlaneGeometry, RingGeometry etc.
Curve examples:
THREE.Curve is the abstract base
LineCurve is a parametric line (use with parameter t)
BezierCurve3 and CatmullRomCurve3 are cubic splines in parameter t (Splines will be discussed later)
TubeBufferGeometry extrudes a curves to a tube custom curves can be created and used based on
THREE.Curve.prototype
CSI4130 Computer Graphics
Next Lecture
Triangles and Rasterization
Textbook: Chapter 2.6, 2.7, 8.1.2, 8.3 Triangles
Triangle Rasterization
Simple Anti-Aliasing
CSI4130 Computer Graphics
Reviews
There are no reviews yet.