3 D Programming D Programming What about solid shapes? - - PDF document

1

Cs 480 Cs 480

3D Programming D Programming

• What about solid shapes?

– glutSolidSphere – glutSolidCube – etc…. – and you guessed it… – glutSolidTeapot

• However, drawing these isn’t as straight forward as the 2D shapes and

the wireframes…..

• Lets look at the result of changing from glutWireTeapot

glutWireTeapot to glutSolidTeapot glutSolidTeapot in the previous program.

2

Cs 480

3D Programming D Programming

What happened? Why can’t we see a solid teapot?

Cs 480

3D Programming D Programming

• For many reasons, but in short…

LIGHTING!!!

• Without lighting, there are no:

– shadows or highlights

• These provide us with the illusion of

depth and 3 dimensions.

3

Cs 480

3D Programming D Programming

• Lets turn on the lights.
• glEnable() is used to turn many OpenGL

features on..

• One of these is lighting, thus:
• glEnable(GL_LIGHTING);

– this can be called in the main or the myInit when the window is being initialized.

Cs 480

3D Programming D Programming

• Now, what does the

teapot look like?

• Not exactly the effect we

were hoping for!

• So far we have enabled

lighting, but we haven’t ac- tually turned any lights

• n!!

4

Cs 480

3D Programming D Programming

• We have to call glEnable() again to turn on a light, thus:
• glEnable(GL_LIGHT0);
• There are a maximum of 8 lights you can use,

GL_LIGHT0, GL_LIGHT1, .., GL_LIGHT7

• And the result….

` ` Cs 480

3D Programming D Programming

Better. But not great if you know what is possible with OpenGL.

´ ´

5

Cs 480

3D Programming D Programming

• How can we improve this?
• First, we select a Shade Model.
• This is set using glShadeModel();

The glShadeModel() determines how the model will be shaded. .

• There are two types of shading:

– GL_FLAT – GL_SMOOTH

^ ^ Cs 480

3D Programming D Programming

glShadeModel glShadeModel(GL_FLAT); (GL_FLAT);

6

Cs 480

3D Programming D Programming

glShadeModel glShadeModel(GL_SMOOTH); (GL_SMOOTH);

Cs 480

3D Programming D Programming

1 2

• This improves the teapot’s surface, but it still isn’t quite right.
• There are parts of the teapot that shouldn’t be displayed.
• e.g. the hidden parts.
• We need a depth test!

] The glShadeModel 1] The glShadeModel() () determines how the model will be shaded. 2] GL_DEPTH_TEST ] GL_DEPTH_TEST allows OpenGL to check for the depth of parts of the image being drawn and thus will make sure that any shapes behind other shapes are not drawn. glEnable(GL_DEPTH_TEST); // “ for removal of hidden surfaces” GL_NORMALIZE, while not that necessary with this teapot, helps us when drawing 3D shapes as it automatically normalizes normal vectors for us.

7

Cs 480

3D Programming D Programming

glEnable(GL_DEPTH_TEST);

Cs 480

3D Programming D Programming

glEnable(GL_NORMALIZE);

Normalize vectors for proper shading

8

Cs 480

3D Programming D Programming

• Initialisation of the drawing environment for 3D.

main( int argc, char **argv) { glutInit(&argc, argv); glutInitDisplayMode(GLUT_SINGLE | GLUT_RGB | GLUT_DEPTH ); glutInitWindowSize(SCREENWIDTH, SCREENHEIGHT); glutInitWindowPosition(100, 100); glutCreateWindow("Solid"); glutDisplayFunc(displaySolid); glEnable(GL_LIGHTING); glEnable(GL_LIGHT0); glShadeModel(GL_SMOOTH); glEnable(GL_DEPTH_TEST); glEnable(GL_NORMALIZE); glClearColor(0.1f,0.1f,0.1f,0.0f); glViewport(0,0, SCREENWIDTH, SCREENHEIGHT); glutMainLoop(); return 1; } Cs 480

3D Programming D Programming

• To display the teapot. This function is registered with myDisplayFunc().

void displaySolid(void) { glMatrixMode(GL_PROJECTION); glLoadIdentity(); glOrtho(-1, 1, -1, 1, 0.1, 100.0); glMatrixMode(GL_MODELVIEW); glLoadIdentity(); gluLookAt(2.3,1.3,2,0,0.25,0,0.0,1.0,0.0); glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glColor3f(0,1,0); glPushMatrix(); glTranslated(0.4,0.5, 0.4); glRotated(30,0,1,0); glutSolidTeapot(0.5); glPopMatrix(); }

9

3D Programming D Programming

• The light source; its location is specified by the

glLightfv() call.

• This example uses the default color for light zero

(GL_LIGHT0), which is white

• You can also locate the lights wherever you desire -
• you can position them near the scene, as a desk lamp

would be, or an infinite distance away, like the sun.

• In addition, you can control whether a light produces a

narrow, focused beam or a wider beam.

Computer Graphics CSC Computer Graphics CSC476 476 17 17 Cs 480

3D Programming D Programming

• Positioning the Light
• lightPosition = x, y, z, w

GLfloat lightPosition[]={2.0f,3.0f,3.0f, 0.0f}; glLightfv(GL_LIGHT0, GL_POSITION, lightPosition);

´ ´

10

Cs 480

3D Programming D Programming

lightPosition[]={2.0f,6.0f,3.0f, 0.0f}; lightPosition[]={1.0f,2.0f,4.0f, 0.0f};

^ ^ Cs 480

3D Programming D Programming

• Turning up the Lights
• lightIntensity = red, green, blue, alpha

GLfloat lightIntensity[] = {0.7f, 0.7f, 0.7f, 1.0f}; glLightfv(GL_LIGHT0, GL_DIFFUSE, lightIntensity);

11

Cs 480

3D Programming D Programming

lightIntensity[] = {1.0f, 1.0f, 1.0f, 1.0f}; lightIntensity[] = {0.2f, 0.2f, 0.2f, 1.0f};

Cs 480

3D Programming D Programming

lightIntensity[] = {0.2f, 1.0f, 0.2f, 1.0f}; lightIntensity[] = {0.2f, 0.0f, 0.8f, 1.0f};

12

Cs 480

3D Programming D Programming

• Types of Light

– GL_AMBIENT

• scattered light, difficult

to determine origin – GL_DIFFUSE

• direct light with an
• rigin

– GL_SPECULAR

• same as shininess, light

comes from one dir- ection and bounces off the surface

Cs 480

Step One

/// The outline code for a simple teapot drawing program is given below: #include <GL/glut.h> #include <math.h> #define W 600 #define H 600 void displaySolid(void) { glMatrixMode(GL_PROJECTION); glLoadIdentity(); glOrtho(-W, W, -H, H, -W, W); glMatrixMode(GL_MODELVIEW); glLoadIdentity(); gluLookAt(0,0,10,0,0,0,0.0,1.0,0.0); glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT); glutSolidTeapot(300); glFlush(); glutSwapBuffers(); }

13

Cs 480

int main(int argc, char** argv) { glutInit(&argc, argv); glutInitDisplayMode(GLUT_DOUBLE|GLUT_RGB|GLUT_DEPTH); glutInitWindowSize(W,H); glutInitWindowPosition(100, 100); glutCreateWindow("My Teapot"); glutDisplayFunc(displaySolid); glClearColor(0.0f,0.1f,0.0f,0.0f); glViewport(0,0, W, H); glutMainLoop(); return 1; }

Cs 480

Type this code in and save it as myTeapot.cpp. Compile and run to test. You should get this:

14

Cs 480

Step Two: Turning on the Lights Step Two: Turning on the Lights

• Not much to look at is it? In order to view a 3D shape, you need to

enable the OpenGL lighting. The following code is used to do this. Place it in the main function just before glutMainLoop().

glEnable(GL_LIGHTING); glEnable(GL_LIGHT0); glShadeModel(GL_SMOOTH); glEnable(GL_DEPTH_TEST); glEnable(GL_NORMALIZE); What do each of them do? GL_LIGHTING enables OpenGL lighting. GL_LIGHT0 is light number 1. This refers to the actual light (e.g. the light bulb). OpenGL had 8 lights in all, GL_LIGHT0 .. GL_LIGHT7.

` ` Cs 480

The glShadeModel() determines how the model will be shaded. If it is smooth shaded (GL_SMOOTH) it uses Gourand shading. If it is set with GL_FLAT, it will shade each polygon in the shape a uniform shade. GL_DEPTH_TEST allows OpenGL to check for the depth of parts of the image being drawn and thus will make sure that any shapes behind other shapes are not drawn. GL_NORMALIZE, while not that necessary with this teapot, helps us when drawing 3D shapes as it automatically normalises normal vectors for us. Your Turn Add the lines of code for lighting as above. Save, compile and test your program. Determine the effect of using GL_FLAT instead of GL_SMOOTH for the shade model.

´ ´

15

Cs 480

Each light has a position and intensity. You specify each using an array of values. The position is defined thus: GLfloat lightPosition[]={0.0f,0.0f,100.0f, 0.0f}; where the values are x, y, z and w (homogeneous coordinates - 4D). The intensity of the light is defined thus: GLfloat lightIntensity[] = {0.9f, 0.9f, 0.9f, 1.0f}; where the values are red, green, blue and alpha (just set alpha to 1 for now). Once you have declared the position and the intensity, you will need to register it with OpenGL so that it can take affect, thus: glLightfv(GL_LIGHT0, GL_POSITION, lightPosition); glLightfv(GL_LIGHT0, GL_DIFFUSE, lightIntensity); The previous four lines of code can be placed as the first lines in the myDisplay function for this example, although you could also put them in a myInit() function or anywhere else in the program when you want the lights turned on. GL_DIFFUSE in the last line of code above refers to the color of the light coming directly from the light source. You can also add other glLightfv() colors for the light as GL_AMBIENT (light that doesn’t seem to come from one direction but rather is bounced around by the environment) and GL_SPECULAR (light coming from one direction, but bouncing off the object). You can set up as many of these as you like for any color you like. Your Turn Add the lighting lines to your program. What is the effect of moving the light around in the x direction?

^ ^ Cs 480

3D Programming D Programming

• Surface Colours

– Light can make an object appear in a different colour, but the actual colour of the object needs to be set differently. – For this we use glMaterialfv() – The material of an object can be ambient, diffuse and specular, just as for light. It also has a factor of shininess.

16

• Most of the material properties are conceptually similar to ones you've

already used to create light sources. The

• mechanism for setting them is similar, except that the command used is

called glMaterial*().

• void

void glMaterial{if}(GLenum glMaterial{if}(GLenum face, GLenum pname face, GLenum TYPEparam); ); pname, , TYPEparam

• void

void glMaterial{if}v(GLenum glMaterial{if}v(GLenum face, GLenum pname face, GLenum , TYPE *param pname, TYPE *param); );

• Specifies a current material property for use in lighting calculations. face

can be GL_FRONT, GL_BACK, or GL_FRONT_AND_BACK to indicate which face of the object the material should be applied to.

• The particular material property being set is identified by pname and the

desired values for that property are given by param, which is either a pointer to a group of values (if the vector version is used) or the actual value (if the nonvector version is used).

• The nonvector version
• works only for setting GL_SHININESS.
• The possible values for pname are shown in Table 5-3.
• Note that GL_AMBIENT_AND_DIFFUSE allows you to set both the

ambient and diffuse material colors simultaneously to the same RGBA value.

Computer Graphics CSC Computer Graphics CSC476 476 31 31

• Parameter

Name Default Value Meaning

• GL_AMBIENT

(0.2, 0.2, 0.2, 1.0) ambient color of material

• GL_DIFFUSE

(0.8, 0.8, 0.8, 1.0) diffuse color of material

• GL_AMBIENT_AND_DIFFUSE ambient and diffuse color of

material

• GL_SPECULAR

(0.0, 0.0, 0.0, 1.0) specular color of material

• GL_SHININESS

0.0 specular exponent

• GL_EMISSION (0.0, 0.0, 0.0, 1.0) emissive color of material

Computer Graphics CSC Computer Graphics CSC476 476 32 32

17

Cs 480

3D Programming D Programming

• Surface Colours
• For example:

GLfloat mat_ambient[]= {0.5f, 0.8f, 0.6f, 1.0f}; GLfloat mat_diffuse[] = {0.6f, 0.8f, 0.6f, 1.0f}; GLfloat mat_specular[] = {1.0f, 0.8f, 1.0f, 1.0f}; GLfloat mat_shininess[] = {10.0f}; glMaterialfv(GL_FRONT, GL_AMBIENT, mat_ambient); glMaterialfv(GL_FRONT, GL_DIFFUSE, mat_diffuse); glMaterialfv(GL_FRONT, GL_SPECULAR, mat_specular); glMaterialfv(GL_FRONT, GL_SHININESS, mat_shininess);

Cs 480

3D Programming D Programming

• Surface Colours

18

Cs 480

Part Part 9

Contents Contents

What is Computer Graphics? Rendering?

• Rendering Techniques
• Pipeline-Based Rendering
• Ray-Tracking

19

Graphics & Rendering Graphics & Rendering Rendering Rendering

• 3d to 2d projections,known as "rendering“

– World and camera views – Mapping 3D data to 2D – Rotating objects to acquire a better viewing angle

20

Rendering Objects Rendering Objects

• We know how to model mesh objects,

manipulate a jib camera, view objects, and make pictures.

• Now we want to make these objects look

visually interesting, realistic, or both.

• We want to develop methods of rendering

a picture of the objects of interest:

computing how each pixel of a picture

should look.

Rendering Objects ( Rendering Objects (2) )

• Much of rendering is based on different

shading models, which describe how light from light sources interacts with

• bjects in a scene.

– It is impractical to simulate all of the physical principles of light scattering and reflection. – A number of approximate models have been invented that do a good job and produce various levels of realism.

21

Rendering Rendering

• Rendering: deciding how a pixel should

look

• Example: compare wireframe (left) to wire-

frame with hidden surface removal (right)

Rendering ( Rendering (2) )

• Example: Compare mesh objects drawn

using wire-frame, flat shading, smooth (Gouraud) shading

22

Rendering ( Rendering (3) )

• Compare to images with specular

highlights, shadows, textures

World and Camera Views World and Camera Views

• In a 3D world, 3 axes denoting the X, Y and Z axes of three

dimensional world,

• and a very basic interpretation of what a camera looks like. The

grayish cube is the body of the camera, the black cube on top of it is the camera's lens, and the line coming out of the camera's bottom is supposed to depict a leg at the bottom of the camera, so we can understand what's up and down from the camera's viewpoint.

• In the right panel of the picture you can see what the camera

sees, it's a camera view of our world,

23

Mapping D data to 2D Mapping 3D data to D

• The main goal of a renderer is to transform and project

the 3D coordinates of the objects to the 2D screen.

• Assumes:

– the camera at a fixed position. – the camera always looks up the Z direction, and always looks perpendicular to the XY plane. – The camera is placed in such a position that it sees the axes on the XY plane similar to the X and Y axes on a computer screen. – the X direction on a computer screen goes from left to right, where the Y direction goes from the top of your screen to the bottom of your screen.

Mapping Mapping 3D data to D data to 2D

• As we're looking along the Z axis, all objects that

should be rendered on our screen appear smaller as their coordinates have bigger Z values.

• Similarly, objects appear bigger as their Z values are

smaller, since their coordinates are closer to the camera.

• In order to transform 3D coordinates to 2D

coordinates, we can thus simply divide the X and Y values in the coordinates by the Z value in order to display them as X and Y coordinates in a 2 dimensional view.

• x2d = (x3d / z3d);
• y2d = (y3d / z3d);

24

Mapping D data to 2D Mapping 3D data to D

• Some Z values will be negative, and dividing a

X, Y coordinate by this negative Z value will not make it bigger, but it will reverse the sign of our X and Y coordinates and we would be scaling these coordinates the wrong way.

• In order to overcome this problem, we add a

number to the Z value so all Z values are strictly positive before we divide the X and Y values by this Z. This extra number is called a distance.

Mapping D data to 2D Mapping 3D data to D

• After computed the 2 dimensional X and Y values of the projected

coordinates, it needs to scale the new coordinates up or down to make sure that the objects fit your viewport. – To use a scaling factor of your 2D coordinates so it fits your screen

• 2D image would be appear around the top left corner of the

computer screen, since the origin of a computer screen sits at the top left of the screen – To add an X and Y offset to your computed 2D coordinates in

• rder to put the projected objects in the middle of the screen
• The resulting code for projecting a 3D coordinate to a 2D

coordinate using a camera following those assumption will look like,

– x2d = xOffset + scale * x3d / ( z3d + distance );

y2d = yOffset + scale * y3d / (z3d + distance );

25

Basics of Rendering Basics of Rendering

• Pipeline Based Rendering

– Objects in the scene are rendered in a sequence of steps that form the Rendering Pipeline.

• Ray-Tracing

– A series of rays are projected thru the view plane and the view plane is colored based on the object that the ray strikes

More About Rendering More About Rendering

More About Rendering

26

Scene Definitions Scene Definitions

Camera View Plane Objects/Models View Frustrum

Pipeline Rendering Pipeline Rendering

Transform Illuminate Transform Clip Project Rasterize Model & Camera Model & Camera Parameters Parameters Rendering Pipeline Rendering Pipeline Framebuffer Framebuffer Display Display

27

Advanced Digital Image Processing, Advanced Digital Image Processing, Lecture # Lecture #12 12

Rendering: Transformations Rendering: Transformations

• So far, discussion has been in screen

space

• But model is stored in model space

(a.k.a. object space or world space)

• Three sets of geometric transformations:

– Modeling transforms – Viewing transforms – Projection transforms

The Rendering Pipeline: The Rendering Pipeline: 3-

• D

D

Scene graph Object geometry Lighting Calculations Clipping Modeling Transforms Viewing Transform Projection Transform

28

The Rendering Pipeline: 3-D

Modeling Transforms Scene graph Object geometry Lighting Calculations Viewing Transform Clipping Projection Transform Result: Result:

• All vertices of scene in shared

All vertices of scene in shared 3-

• D “world” coordinate system

D “world” coordinate system

Rendering: Transformations Rendering: Transformations

• Modeling transforms

– Size, place, scale, and rotate objects and parts of the model w.r.t. each other – Object coordinates Ù world coordinates

Z X Y X Z Y

29

Modeling Transforms Scene graph Object geometry Lighting Calculations Viewing Transform Clipping Projection Transform Result: Result:

• Scene vertices in

Scene vertices in 3-

• D “view” or “camera” coordinate system

D “view” or “camera” coordinate system

The Rendering Pipeline: 3-D

Rendering: Transformations Rendering: Transformations

• Viewing transform

– Rotate & translate the world to lie directly in front of the camera

• Typically place camera at origin
• Typically looking down -Z axis

– World coordinates Ù view coordinates

30

Advanced Digital Image Processing, Advanced Digital Image Processing, Lecture # Lecture #12 12

Modeling Transforms Scene graph Object geometry Lighting Calculations Viewing Transform Clipping Projection Transform Result: Result:

• 2-
• D screen coordinates of clipped vertices

D screen coordinates of clipped vertices

The Rendering Pipeline: 3-D

Advanced Digital Image Processing, Advanced Digital Image Processing, Lecture # Lecture #12 12

• Perspective Camera
• Orthographic Camera

Rendering: Transformations Rendering: Transformations

31

Cs 480

Part Part 10 10

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 62 62

• We will examine:

– Visual Realism

• Lighting
• Shading
• Texturing; and
• Shadowing

32

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 63 63

Visual Realism Visual Realism

• When rendering (painting) an image we

need to consider the factors that will make the scene appear real.

• Provides a “suspension of disbelief” for the
• viewer. e.g. Shrek

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 64 64

Visual Realism Visual Realism

• Lowest Level is

Wireframe

– Outline of Solids – Quick to render – OpenGL takes care of hidden lines.

33

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 65 65

Visual Realism Visual Realism

• Flat Shading

– Each polygon is shaded in the same tone. – Amount of light is calculated from a single point on the surface. – Same normal applies for whole surface.

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 66 66

Visual Realism Visual Realism

• Smooth Shading

– Gouraud Shading – Different grey levels are used across a polygon by interpolating the difference between vertices.

34

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 67 67

Shading Models Shading Models

• Shading Model

– how light is scattered or reflected from a surface – frequently presupposes that two types of light sources illuminate the objects in a scene: point light and ambient light – light can be absorbed , reflected and refracted.

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 68 68

Shading Models Shading Models

• Reflection

– diffuse scattering : some light penetrates the surface and is re- radiated uniformly in all directions – specular reflection : mirrorlike and highly directional

35

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 69 69

Reflected Light Reflected Light

• m is a vector normal to the surface at P
• s is the vector from P to the light
• v is the vector from P to the viewer

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 70 70

Reflected Light Reflected Light

• The amount of reflected light can be

calculated using the angles between these vectors.

• A mesh has two sides. We need to

calculate the light for the side we are viewing from.

• This is why it is important that we have

the right normal vector.

36

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 71 71

Reflected Light Reflected Light

• We determine if a side is

visible by looking at the normal, m, and the vector to the eye, v.

• If v.m > 0 (less than 90o)

the side is visible.

• E.g. the eye must be on

the same side of the mesh as the light.

m

v v

< 90 > 90

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 72 72

Reflected Light Reflected Light

• Calculating diffuse reflected light using m, v and s.

– As diffuse light is scattered uniformly in all directions, the location

• f the eye, v, is not important unless v.m < 0 where we want the

light intensity I = 0 – The relationship between the brightness of a surface and its

• rientation toward the light is based on cos( ).

– Id=Ispd cos( ) or – Id=Ispd (s.m/|s||m|)

• pd is the diffuse reflection coefficient
• (how reflective the surface is)

s m

37

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 73 73

Reflected Light Reflected Light

• Calculating diffuse reflected light using m, v and s.

– If the eye is on the other side of the surface the dot product will be negative. – In this case we want Id to be 0, therefore: – Id=Ispd max(s.m/|s||m|, 0)

• This relationship is called Lamberts Law

s m

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 74 74

Specular Light Specular Light

• Real objects do not scatter light uniformly.
• A specular component accounts for this.
• We will examine the Phong model.
• In the Phong model, the amount of light

reflected is greatest in the direction of the mirror reflection.

38

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 75 75

Specular Light Specular Light

• This is the direction in which all light would

travel if the surface was a perfect mirror.

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 76 76

Specular Light Specular Light

• From module 4, we remember that a

perfect reflection is:

– r = -s + 2 (s.m/|m|2)m

• Light, not reflected from the true

reflection angle falls off determined by the angle, , between r and v.

• In the Phong model, the actual fall
• ff is calculated using a power, f, of

cos( ), or

• Isp=Isps(r.v/|r||v|)f with 1 <= f <= 200

(or whatever looks good!!)

• ps specular reflection coefficient

39

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 77 77

Ambient Light Ambient Light

• Light lands on objects

from multiple angles

• f reflection from
• ther objects and the

environment.

• Computationally

expensive to calculate.

• Ambient light has no

particular origin.

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 78 78

Ambient Light Ambient Light

• The ambient light

coefficient: pa, is assigned to each face.

• The source intensity

Ia is multiplied by the coefficient and added to any diffuse or specular lighting.

40

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 79 79

Combining Light Sources Combining Light Sources

I = Iapa + Idpd*Lambert + Ispps*Phongf

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 80 80

Colour Colour

• As we know, colour can be constructed

from amounts of red, green and blue.

• The intensity of reflected colour can be

calculated by computing the intensity for red, green and blue and adding them.

41

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 81 81

Colour Colour

Ir = Iarpar + Idrpdr*Lambert + Isprpsr*Phongf Ig = Iagpag + Idgpdg*Lambert + Ispgpsg*Phongf Ib = Iabpab + Idbpdb*Lambert + Ispbpsb*Phongf

Cs 480

The End The End

• Next Week

– Creating complex 3D shapes using polygon meshes.

´ ´

42

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 83 83

Textures Textures

• Textures enhance realism by pasting

images onto surfaces of a mesh.

• We can create a surface texture with:

– bitmaps – computed functions

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 84 84

Bitmap Textures Bitmap Textures

• Take a bitmap and

paste onto a mesh surface.

• We have looked at

this in previous modules.

43

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 85 85

Bitmap Textures Bitmap Textures

• An image is specified as W=1 and H=1

regardless of the aspect ratio.

• At W=1 we are all (100%) of the way across the

width.

• Vice versa for the Height.

(0,0) (1,1)

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 86 86

Bitmap Textures Bitmap Textures

glBegin(GL_QUADS); glTexCoord2f(0.0f, 0.0f); glVertex3f(-1.0f,

• 1.0f,

1.0f); glTexCoord2f(1.0f, 0.0f); glVertex3f( 1.0f,

• 1.0f,

1.0f); glTexCoord2f(1.0f, 1.0f); glVertex3f( 1.0f, 1.0f, 1.0f); glTexCoord2f(0.0f, 1.0f); glVertex3f(-1.0f, 1.0f, 1.0f); glEnd();

44

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 87 87

Bitmap Textures Bitmap Textures

glBegin(GL_QUADS); glTexCoord2f(0.0f, 0.0f); glVertex3f(-1.0f,

• 1.0f,

1.0f); glTexCoord2f(0.0f, 0.5f); glVertex3f( 1.0f,

• 1.0f,

1.0f); glTexCoord2f(0.5f, 0.5f); glVertex3f( 1.0f, 1.0f, 1.0f); glTexCoord2f(0.0f, 0.5f); glVertex3f(-1.0f, 1.0f, 1.0f); glEnd();

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 88 88

Coded Textures Coded Textures

• A texture created on the fly using

programming code.

• The texture can be modified as the

program executes.

45

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 89 89

Coded Textures Coded Textures

• Step One: Specify the Texture

static char *texture[] = { ". ...............", ". ...............", ". ...............", "...xx.....xx....", "...xx.....xx....", ". ...............", "......xx. .......", ". ...............", "..xx.......xx...", "....xx...xx.....", "......xxx.......", ". ...............", ". ...............", ". ...............", ". ...............", ". ...............", }; 31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 90 90

Coded Textures Coded Textures

• Step Two: Create

an RGB image

GLubyte floorTexture[16][16][3]; GLubyte *loc; loc = (GLubyte*) floorTexture; for (int i = 0; i < 16; i++) { for (int j = 0; j < 16; j++) { if (texture[i][j] == 'x') { /* Nice green. */ loc[0] = 0x9f; loc[1] = 0x2f; loc[2] = 0x1f; } else { /* Light gray. */ loc[0] = 0xaa; loc[1] = 0xaa; loc[2] = 0xaa; } loc += 3; } }

46

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 91 91

Coded Textures Coded Textures

• Step Three: Build

Texture Map

gluBuild2DMipmaps(GL_TEXTURE_2D, 3, 16, 16, GL_RGB, GL_UNSIGNED_BYTE, floorTexture);

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 92 92

Shadows Shadows

• Shadows provide realism
• Shadows are the result of light being blocked by

an object and fall on another object.

• Shadows can be:

– 1. ‘hand-drawn’ using textures

• however they are not dynamic and no good for an animated

environment.

– 2. calculated

47

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 93 93

Shadows Shadows

• Case Study: Making Shadows.
• tuteshadows.cpp

31 31/05 05/2009 2009 Computer Graphics CSC Computer Graphics CSC3406 3406 94 94

Reflections Reflections

• Case Study: Creating Reflections
• reflections.cpp

48

95 95 Computer Graphics CSC Computer Graphics CSC476 476

Computer Graphics Computer Graphics

Chapter Chapter 8

Computer Graphics CSC Computer Graphics CSC476 476 96 96

This Chapter This Chapter

• Three Dimensional Viewing

– Developing a Camera – Fly through a scene – Mathematics of Projections

49

Introduction Introduction

• We have already learnt how to:

– Create 2D and 3D solid objects – Construct a 3D scene – Add lighting and colours – Create complex mesh surfaces

• So what do we do now?

– Moving/Flying through a scene – Adding perspective

Computer Graphics CSC Computer Graphics CSC3406 3406 97 97 Computer Graphics CSC Computer Graphics CSC3406 3406 98 98

The Camera The Camera

• We previously looked at setting up a

camera in lecture 5.

– glOrtho() and gluLookAt() – these created parallel projections

• We now want to modify a scene to give us

perspective projections.

– lines converge as they get further away

50

Computer Graphics CSC Computer Graphics CSC3406 3406 99 99

The Camera The Camera

• The Perspective Camera

Computer Graphics CSC Computer Graphics CSC3406 3406 100 100

The Camera The Camera

• Setting up the Camera

– instead of glOrtho() we now use: – gluPerspective()

• gluPerspective

– viewAngle – aspectRatio (W/H) – near plane – far plane

51

Computer Graphics CSC Computer Graphics CSC3406 3406 101 101

The Camera The Camera

glMatrixMode(GL_PROJECTION); glLoadIdentity(); gluPerspective(viewAngle, aspectRatio, N, F);

Computer Graphics CSC Computer Graphics CSC3406 3406 102 102

The Camera The Camera

• Positioning the Camera

– The camera is positioned using a combination of translations and rotations. – Think if the camera being in the same location as the viewers eye.

52

Computer Graphics CSC Computer Graphics CSC3406 3406 103 103

The Camera The Camera

eye(x,y,z) lookat(x,y,z) up(x,y,z)

Computer Graphics CSC Computer Graphics CSC3406 3406 104 104

The Camera The Camera

glMatrixMode(GL_MODELVIEW); glLoadIdentity(); gluLookAt(eye.x, eye.y, eye.z, look.x, look.y, look.z, up.x, up.y, up.z);

53

Computer Graphics CSC Computer Graphics CSC3406 3406 105 105

The Camera The Camera

• The camera can have an arbitrary orientation

and position.

• Therefore we can think of the camera having

its own axes.

Computer Graphics CSC Computer Graphics CSC3406 3406 106 106

The Camera The Camera

• Camera Movement

– A camera has six degrees of freedom:

• 1. slid in 3 directions; and
• 2. rotated in 3 directions

54

Computer Graphics CSC Computer Graphics CSC3406 3406 107 107

The Camera The Camera

• Camera Movement

– The camera can move along its axes.

Computer Graphics CSC Computer Graphics CSC3406 3406 108 108

The Camera The Camera

• Camera Movement

– The camera can move along its axes. – This is called sliding the camera.

55

Computer Graphics CSC Computer Graphics CSC3406 3406 109 109

The Camera The Camera

• Camera Movement

– To move the camera along the u axis you would simply perform

• eye = eye + Du

– To move slide the camera in any direction:

eye.x = dU*u.x + dV*v.x + dN*n.x eye.y = dU*u.y + dV*v.y + dN*n.y eye.z = dU*u.z + dV*v.z + dN*n.z

u

v

n

Computer Graphics CSC Computer Graphics CSC3406 3406

110 110

The Camera The Camera

• Camera Movement

– Besides physically moving the camera to another location… – the camera can be tilted in different directions to look at different parts of the scene.

56

Computer Graphics CSC Computer Graphics CSC3406 3406

111 111

The Camera The Camera

• Camera Movement

We use a plane analogy to describe the cameras movement.

• a rotation from the horizontal along the length is called PITCH
• a rotation from the horizontal along the width is called ROLL
• a rotation around the vertical is called YAW

Computer Graphics CSC Computer Graphics CSC3406 3406

112 112

The Camera The Camera

• Pitch

v’ = cos( )v – sin( )n n’ = sin( )n + cos( )v

n

v

57

Computer Graphics CSC Computer Graphics CSC3406 3406

113 113

The Camera The Camera

• Roll

u’ = cos( )u + sin( )v v’ = cos( )v - sin( )u

u

v

Computer Graphics CSC Computer Graphics CSC3406 3406

114 114

The Camera The Camera

• Yaw

n’ = cos( )n - sin( )u u’ = sin( )n + cos( )u

u n

58

Computer Graphics CSC Computer Graphics CSC3406 3406

115 115

The Camera The Camera

• A Teapot Fly By

teapot_flyby.exe

• A Mesh Surface Fly By

flyby1.exe

Computer Graphics CSC Computer Graphics CSC3406 3406

116 116

Projections Projections

• Parallel
• Perspective

59

Computer Graphics CSC Computer Graphics CSC3406 3406

117 117

A D C B projection plane

Projections Projections

Parallel Projection

D’ C’ B’

A’

centre of projection at infinity

Computer Graphics CSC Computer Graphics CSC3406 3406

118 118

Projections Projections

Parallel Projection

A D C B projection plane D’ C’ B’

A’

centre of projection at infinity

• Points on the object are projected to the viewing plane along parallel

lines

• Preserves relative dimensions of the object but does not give a realistic

presentation

60

Computer Graphics CSC Computer Graphics CSC3406 3406

119 119

Projections Projections

Parallel Projection

A D C B projection plane D’ C’ B’

A’

centre of projection at infinity                         =              

1 1 1 1

1

z y x

z y x

p p p

Computer Graphics CSC Computer Graphics CSC3406 3406 120 120

Projections Projections

Parallel Projection

So all we are really doing is getting rid of the z coordinate to take the coordinates from 3d to 2d!!!

y z x

61

Computer Graphics CSC Computer Graphics CSC3406 3406 121 121

Perspective Projections Perspective Projections

Computer Graphics CSC Computer Graphics CSC3406 3406 122 122

Perspective Projections Perspective Projections

• Projecting a 3D Point

– We use similar triangles to project the point onto the plane in the line of the eye.

near plane N

z (x,y,z)

62

Computer Graphics CSC Computer Graphics CSC3406 3406 123 123

Perspective Projections Perspective Projections

• Projecting a 3D Point

– x’/x = N/-z (z in the negative direction) – y’/y = N/-z – Once projected onto a 2D plane the z coordinate is not needed.

near plane N

z (x,y,z)

(x’,y’)

Computer Graphics CSC Computer Graphics CSC3406 3406 124 124

Perspective Projections Perspective Projections

• Properties
• 1. Parallel lines in 3D will meet at a vanishing point

63

Computer Graphics CSC Computer Graphics CSC3406 3406 125 125

Perspective Projections Perspective Projections

• Properties
• 2. Lines that pass behind the eye of the camera

cause a catastropic “passage through infinity”.