This chapter covers Vector graphics.
Contents of Vector Graphics
1. Vector Graphic Characteristics

Vector Graphic
 Main Characteristics
 Compact (less memory than image for storage)
 Scalable (No quality change with scaling, zoom in/out) → resolutionindependent
 Small file size and memory < bitmap image
 Attractive for networked multimedia, but not widely used on WWW
 SVG (W3C standard) < Shockwave Flash (SWF) (de facto standard)
 Common formats for PDF, SVF, SWF
 Main Characteristics

Modeling  Rendering
 Modeling
 Represent lines, curves, shapes,... by parameters of their
defining equations  Ex) line y = mx + c, store m and c (or endpoints)
 Represent lines, curves, shapes,... by parameters of their
 Rendering
 Compute pixels (location, color) which must be set in order to draw the line, curves,…
 Generally, rendering result will exhibit 'Jaggies‘
 Pixels' coordinates are integers, equations in vector graphic uses real numbers – no exact matching
 Modeling
2. Antialiasing
 Example

Antialiasing
 Mitigate aliasing by coloring pixels in shades of grey (for a black line on figure in next page)
 Shading grey (gray) algorith

Rendering a vector object to produce an image made up of pixels
 Jaggies  called aliasing
 Ex) Line  continuous line must be approximated by discrete pixels of finite size

Primitive Shapes for Graphic
 Generally, drawing programs such as Visio, Adobe illustrator, provide primitive shapes that can be easily represented mathematically
 Rectangles and squares (may rounded corners)
 Ellipses and circles
 Straight lines, polylines and polygons
 Smooth (Bézier) curves
 Generally, drawing programs such as Visio, Adobe illustrator, provide primitive shapes that can be easily represented mathematically
3. Open GL

OpenGL Geometric Primitives
 Open Graphic Library by Silicon Graphic in 1992
 2D and 3D graphic standard API
 All geometric primitives are specified by vertices
 Open Graphic Library by Silicon Graphic in 1992

Smooth (Bezier) Curves
 Smooth curves completely specified by four control points
 2 endpoints (P0, P3)
 2 direction points (P1, P2)
 Making a curve
 Define a curve by length and direction of lines from endpoints to direction points
 Define a curve by length and direction of lines from endpoints to direction points
 Smooth curves completely specified by four control points

Definition of Path
 Define Bézier curves in terms of path
 Closed path (curves connected endtoend) and open path
 Use Pen tool in drawing programs to build up path
 Define Bézier curves in terms of path

Stroke and Fill
 Apply Stroke to make path visible
 Like tracing with ink, specify width and color
 Apply Fill to closed path or shape
 Like coloring it in, specify color or a gradient fill or pattern fill
 Gradients may be linear or radial (방사형태)
 Stroke Styles
 Gradient Fill, Pattern FIll
 OpenGL Example  Gradient Fill
 Fill : Coloring inside path
Which is inside and outside? Nonzero winding number rule
 Nonzero winding number rule
 Apply Stroke to make path visible

Vector Transformations
 Typical transformation of vector object can be done by changing stored vector values
 Translation (linear movement)
 Scaling (Zoom in and out)
 Reflection
 Rotation
 Shearing (skewing)
 Transformations
 Typical transformation of vector object can be done by changing stored vector values
4. 3D Vector Graphic – Modeling and Rendering

3D Vector Graphics
 Conceptually simple extension of 2D
 Add zaxis at right angles to x and yaxes
 Point is defined by (x, y, z) coordinates
 Generalize coordinate geometry from 2D to 3D
 Practically complicated and difficult
 Requires 3D visualization skills
 Complex tools, need high computational power
 3D modeling  rendering
 Model  geometrical features of object
 Rendering  surface characteristics, colors and textures
 Conceptually simple extension of 2D

3D Modeling
 Three general approach to model 3D objects
 Constructive solid geometry
 Use of few geometric basis model such as cube, cylinder, sphere, pyramid
→ Set operations of union, intersection, difference  Good for modeling manmade objects, architecture (CAD)
 Use of few geometric basis model such as cube, cylinder, sphere, pyramid
 Freeform modeling
 Use representation of an object’s boundary surface as the basis of model – ex) polygon mesh
 Procedural modeling
 Use of some algorithm or procedure
 Ex) Fractal, Metaballs, Particle systems
 Constructive solid geometry
 Constructive solid geometry model
 Freeform modeling (Polygon Mesh)
 represent dolphin' s boundary surface as polygon mesh
 represent dolphin' s boundary surface as polygon mesh
 Fractals (Procedural modeling)
 In 1975, Benoit Mandelbrot
 Selfsimilarity
 Exhibit same structure at all levels of detail similar to whole structure ( each part is reduced size copy of whole)
 Recursively generated
 Mandelbrot set
 Three general approach to model 3D objects

3D Rendering
 A procedure giving a 3D realism to the model
 Surface characteristics (shading), colors, textures, etc.
 Shading
 Means surface characteristics of object under different
lighting conditions or light sources such as – spots,
diffuse, ...  Need a computing model based on physics of light
 Shading example
 Shading  different coloring for each face of box or
 giving a different amount of light for each face of box
 Means surface characteristics of object under different
 Shading Algorithms
 Ray casting
 Different color across each polygon mesh surface to simulate 3D object
 Not considering light interaction between object
 Flat, Gouraud, Phong shading
 Ray tracing
 Take account of interaction between objects
 Take account of interaction between objects
 Radiosity
 Simulate light diffusion and reflections between the objects and shadows
 Simulate light diffusion and reflections between the objects and shadows
 Summary
 Ray Casting
 Flat
 Gouraud
 Phong
 Ray Tracing
 Radiosity
* Ray Casting  Ray Tracing  Radiosity
* Less Expensive =======>> More Accurate
 Ray Casting
 Ray casting
 A procedure giving a 3D realism to the model