si23 introduction to computer graphics l.
Download
Skip this Video
Loading SlideShow in 5 Seconds..
SI23 Introduction to Computer Graphics PowerPoint Presentation
Download Presentation
SI23 Introduction to Computer Graphics

Loading in 2 Seconds...

play fullscreen
1 / 32

SI23 Introduction to Computer Graphics - PowerPoint PPT Presentation


  • 216 Views
  • Uploaded on

SI23 Introduction to Computer Graphics Lecture 10 – Introduction to 3D Graphics Graphics Programming 3D Graphics URL VRML viewer 2D vector graphics surfaces Image Display URL SVG Viewer lines, areas URL GIMP viewing, shading graphics algorithms colour interaction

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'SI23 Introduction to Computer Graphics' - LeeJohn


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
si23 introduction to computer graphics

SI23Introduction to Computer Graphics

Lecture 10 – Introduction to 3D Graphics

course outline

Graphics

Programming

3D

Graphics

URL

VRML

viewer

2D vector

graphics

surfaces

Image

Display

URL

SVG

Viewer

lines,

areas

URL

GIMP

viewing, shading

graphics

algorithms

colour

interaction

Course Outline
  • Graphics programming
    • Using OpenGL with C, C++

OpenGL

API

animation

2d graphics picture description
SVG is a vector graphics description language

<?xml version="1.0" ?>

<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 20010904//EN" "http://www.w3.org/TR/2001/REC-SVG-20010904/DTD/svg10.dtd">

<svg width = "300" height = "300">

<rect x = "100" y = "100" width = "100" height = "100" style = "fill:red" />

</svg>

SVG Viewer

2D Graphics – Picture Description
2d graphics programming approach
For programming graphics, there are a number of APIs, or Application Programming Interfaces

OpenGL is industry standard

Both 2D and 3D

2D Graphics – Programming Approach

User Program

calling OpenGL

functions

OpenGL Library

objectives for this part
Objectives for This Part
  • To understand how 3D scenes can be modelled - in terms of geometry and appearance - and rendered on a display
  • To be able to program interactive 3D graphics applications using industry standard software (OpenGL)
lecture outline the basics
Lecture Outline - The Basics
  • MODELLING and VIEWING
    • representing objects in 3D
    • transforming objects and composing scenes
    • specifying the camera viewpoint
  • PROJECTION
    • projecting 3D scenes onto a 2D display surface
  • RENDERING
    • illumination
    • shading
    • adding realism via textures, shadows
basic modelling and viewing
Basic Modelling and Viewing

y

objects represented

as set of faces - ie

polygons- and faces

as a set of points

x

z

scenes composed

by scaling, rotating,

translating objects to

create a 3D world

Camera position

specified, together

with its direction of view

camera

projection

camera

Projection
  • Projection
    • 3D scene is projected onto a 2D plane

view

plane

rendering
Rendering

illumination:

how is light reflected

from surfaces?

??

shading:

how do we use our

knowledge of illumination

to shade surfaces in our

world?

rendering11
Rendering
  • texture
  • shadows
creating 3d graphics
OpenGL is an API that allows us to program 3D graphics

As well as 2D

VRML is a language that allows us to describe 3D graphics scenes

Cf SVG for 2D

Creating 3D Graphics
applications computer aided design
This is Hubble Space Telescope modeled using the BRL-CAD system

Uses CSG modeling and ray tracing for rendering

http://ftp.arl.mil/brlcad

Applications - Computer-Aided Design
applications virtual reality
Virtual oceanarium built for EXPO in Lisbon

Example taken from Fraunhofer Institute site

http://www.igd.fhg.de

Applications - Virtual Reality
before we begin mathematics
Before we begin...mathematics!
  • 3D Co-ordinate Systems

y

y

z

x

x

z

LEFT

RIGHT

z points away

z points toward

Align thumb with x, first finger with y, then second finger

of appropriate hand gives z direction. Common now to

use a RIGHT HANDED system.

points and vectors
Points and Vectors
  • We shall write points as column vectors

y

P

P =

x

y

z

x

z

Difference of two points gives a direction vector:

D = P2 - P1

y

P2

Note: If P1 and P2

are on a plane, then

D lies in the plane

x

z

P1

magnitude of a vector
Magnitude of a Vector
  • The magnitude of a vector V = (v1,v2,v3)T is given by:

|V| = sqrt(v1*v1 + v2*v2 + v3*v3)

eg (1,2,3)T has magnitude sqrt(14)

  • A unit vector has magnitude 1
  • A unit vector in the direction of V is

V / |V|

scalar or dot product
Scalar or Dot Product
  • The scalar product, or dot product, of two vectors U and V is defined as:

U.V = u1*v1 + u2*v2 + u3*v3

  • It is important in computer graphics because we can show that also:

U.V = |U|*|V|*cosq

where q is the angle between U and V

  • This lets us calculate angle q as

cos q = (u1*v1 + u2*v2 + u3*v3) / (|U|*|V|)

diffuse lighting
Diffuse Lighting
  • Diffuse reflection depends on angle between light direction and surface normal:

reflected intensity = light intensity * cosine of angle between light direction and surface normal

normal

light

scalar product lets

us calculate cosq

q

vector or cross product
Vector or Cross Product
  • The vector or cross product is defined as:

UxV = (u2v3 - u3v2, u3v1 - u1v3, u1v2 - u2v1)

  • We can also show that:

UxV = N |U||V| sin 

where N is unit vector orthogonal to U and V (forming a right handed system) and q is angle between U and V

  • This allows us to find the normal to a plane
    • cross-product of two directions lying in plane , eg (P3-P2), (P2-P1), where P1, P2, P3 are three points in the plane
exercises
Convince yourself that the x-axis is represented by the vector (1,0,0)

What is the unit normal in the direction (2,3,4)?

What is the angle between the vectors (1,1,0) and (1,0,0)?

Which vector is orthogonal to the vectors (1,0,0) and (0,1,0)?

What is the normal to the plane through the points (1,2,3), (3,4,5) and (0,0,0)?

Exercises
polygonal representation
Polygonal Representation
  • Any 3D object can be represented as a set of plane, polygonal surfaces

V7

V6

V8

V5

V3

V2

V4

V1

Note:each vertex part of several

polygons

polygonal representation24
Polygonal Representation
  • Objects with curved surfaces can be approximated by polygons - improved approximation by more polygons
scene organisation
Scene Organisation
  • Scene = list of objects
  • Object = list of surfaces
  • Surface = list of polygons
  • Polygon = list of vertices

scene

vertices

object

surfaces

polygons

polygon data structure

Polygon Table

Vertex Table

V1

X1, Y1, Z1

P1

V1, V2, V3, V4

V2

X2, Y2, Z2

P2

V1, V5, V6, V2

.

...

.

...

Polygon Data Structure

V7

V6

Object Obj1

V5

V8

V3

V2

P2

V4

V1

P1

Object Table

Obj1

P1, P2, P3,

P4, P5, P6

.

...

typical primitives order of vertices
Typical PrimitivesOrder of Vertices
  • Graphics systems such as OpenGL typically support:
    • triangles, triangle strips and fans
    • quads, quad strips
    • polygons
  • How are vertices ordered?
    • convention is that vertices are ordered counter-clockwise when looking from outside an object
    • allows us to distinguish outer and inner faces of a polygon
complex primitives
Complex Primitives
  • OpenGL has utility libraries (GLU and GLUT) which contain various high-level primitives
    • Sphere, cone, torus
    • Polygonal representation constructed automatically
  • Similarly for VRML
  • For conventional graphics hardware:
    • POLYGONS RULE!
automatic generation of polygonal objects
3D laser scanners are able to generate computer representations of objects

for successive heights, 2d outline generated as object rotates

contours stitched together into 3D polygonal representation

Cyberware Cyberscanner in Med Physics at LGI able to scan human faces

Automatic Generation of Polygonal Objects
modelling regular objects
Modelling Regular Objects
  • Sweeping
  • Spinning

sweep axis

2D Profile

R1

R2

spinning axis

sweeping a circle to generate a cylinder as polygons
Sweeping a Circle to Generate a Cylinder as Polygons

V12

V13

V11

V18

V3

V10

V4

V14

V2

V17

V15

V5

V1

vertices at z=depth

V16

V6

V8

V7

V9

vertices at z=0

V1[x] = R; V1[y] = 0; V1[z] = 0

V2[x] = R cos ; V2[y] = R sin ; V2[z] = 0 (q=p/4)

Vk[x] = R cos k; Vk[y] = R sin k; Vk[z] = 0

where

k = 2 p (k - 1 )/8, k=1,2,..8

exercise and further reading
Exercise and Further Reading
  • Spinning:
    • Work out formulae to spin an outline (in the xy plane) about the y-axis
  • READING:
    • Hearn and Baker, Chapter 10