interactive 3d graphics

8/12/2019 Interactive 3d Graphics

1/60

D GRAPHICSPresented by: SAPNA

ME-CSE

13-522


2/60


3/60

Interactive 3d rendering

you caninstantly

influence what

you see on thescreen

-you turn the wheelleft in a racing gameand go thatdirection

Ineractive

Defining things in3 dimensional

world

-you mathematicallydefine objects,materials, lights, anda camera, then usethese together torender onto a two-

dimensional screen

3DMeans

depictionto render means to

create an image

-An artist canrender a scene bypainting it,

-an architect canrender a building in

perspective

Rendering


4/60

Core ideas

Refresh rate , Frames per second

View frustum

The Graphics pipeline

Painters algorithm

Z-Buffer


5/60

Interactivity and FPSRefresh Rate-No of times image is displayed in each second.(This valueis part of the monitor itself, not something that varies.)

Frame Rate-No of different images (frames) displayed per second.

When we take an action, we would like a response from the computerquickly enough that we dont feel slowed down.

How fast is fast enough? ?

It is about six frames per second.- Which means that 6 different images are displayed each second.

For videogames

The minimum rate = 30 frames per second, or even 60 frames per second.

-Most monitors refresh at 60 Hz

This value of 60 Hertz gives an upper limit on theframe rate.

In the film industry,

The frame rate is 24 frames per second, but the refresh rate can be 48 or 72Hertz, with each frame repeatedly projected 2 or 3 times


6/60

View frustum

In computer graphics we think of the camera a bit differently, with theimage being formed in frontof the viewer.

This pyramid-shaped view of the world is called the view frustum.Frustum means a pyramid with its top chopped off.

In computer graphics we simulate the real-world as best we can andtry to determine how many photons are coming from each direction. -----Whatever amount of light we gather from a direction we record at a

pixel on the screen.


7/60

A scene consists of objects, along with lights and a camera.

OBJECTS

different objects, defined in different ways.

Each object is described by some 3D geometry (object coordinates)

It also has some material description saying how light interacts with it.

Objects can also be animated over time

o LIGHTS

As the view changes, some materials look different as the light reflects off themat a different angle, while others dont change.

o CAMERA A camera is also defined for the scene, and interactively changes under the

users control.


8/60

Graphics/rendering pipeline How objects get rendered by a graphics accelerator. This graphics hardware is

usually called the GPU, for Graphics Processing Unit.

The idea of the pipeline is to treat each object separately.

There are three stages

Application Stage-Application sends objects to the GPU. Objects aretypically, 3D triangles!

An application converts a cube into a few triangles. A sphere gets turned intoa bunch of triangles

Geometry Stage -These triangles are modified by the cameras view of the

world, along with whatever modeling transform is applied.

A modeling transform is a way to modify the location, orientation, andeven the size .

Rasterization Stage -This process identifies all the pixels whose centers areinside the triangle. i.e.it fills in the triangle.

These locations then are used to show the image of the triangle on the screen.


9/60


10/60

painters algorithm

The application sends down triangles to be transformed to screen locationsand then filled in.

What happens if two triangles overlap on the screen? How is it decidedwhich one is visible?

-One way to render is what is called thePaintersAlgorithm.

Sort objects based on their distance from the camera, back to front.

Then render the most distant object first, render the next closest object,and so on.

The closest object is drawn last, so it covers up the objects behind it.


11/60

painters algorithm - flaws

This scene cannot be rendered bypainting one object on top of the other

We can get into cycles, where eachobject is in front of the next.

Here, the red triangle is in front ofthe green, which is in front of theblue, which is in front of the red.

Theres no way to fully draw theseobjects in any order and producethe proper image.


12/60

Z-buffer

The Z in the Z-buffer stands for distance from the camera.Buffer is another word for a data array, an image.

For the image, in addition to storing a color at each pixel we alsostore a distance, which is called the z-depth.

The z-depth is often considered as a floating point number

0.0 meaning close to the eye

1.0 meaning the maximum distance from the eye.

The Z-buffer is initially cleared by filling it with 1s


13/60

How z buffer works

Z-depth is checked against thecurrent value stored in the Z-buffer.

The Z-buffer works by keepingtrack of which object is closest tothe camera at each pixel.

In the end, the closest objectscolor at each pixel is stored and sois visible in the final image.


14/60

Coordinate system

In 3D computer graphics we usually use a 3D Cartesiancoordinate system.

Right handed

If you place your thumb of right hand along the X axis andthe index finger along the Y axis, the middle finger is the Zaxis and points towards you.

Left-handed

If you place your thumb of left hand along the X axis and theindex finger along the Y axis, the middle finger is the Z axisand points away from you.

--To convert between these particular two systems is simply amatter of negating the Z coordinate value.

POINTS AND VECTORS

Two distinct mathematical objects we use in computergraphics all the time: points and vectors.

3D pointspecifies a location in space.

3D vectordefines a direction in space


15/60

Triangulation and tessellation

Theword tessellate is from the Greek word tessella, which means a small stone in

a mosaic.

Breaking an object into polygons of any sort is called tessellation.

When it comes to making surfaces, the GPU understands only triangles.

To draw any polygon, we break that polygon into a set of triangles. This process is

called triangulation. The major rule is that when we add an edge, it has to be entirely inside the polygon.

Triangulation is a particular form of tessellation.


16/60

Minimumm triangulation

Incorrect way Correct way


17/60

materials

10/06/2014Lecture 117

Now we need to decide the colour of each pixels taking into account

the objects colour, lighting condition and the camera position

Object

point light source


18/60

A Simple Lighting Model

The standard way to think about a materials appearance is as a few different

components added together:

Emissive +Ambient +Diffuse +Specular

Emissiveits used for coloring glowing objects. For example, a light bulb

Ambientis a fudge factor, something added in so objects look better, especially in

areas that are not directly lit. Diffuse can be thought of as a flat, matte finish.

Specularcan be thought of as the shininess of an object.

Surface color =Emissive +Ambient +Diffuse(light) + Specular(light,viewer)

The mathematical expression :

C = E + A + ( D(L) + S(L,V) )


19/60

Light on a Diffuse Plane

The diffuse term depends on the surface itself and the incoming lightsdirection.

As the angle between the surface and the light increases the lightscontribution to the surface goes down by the cosine of this angle.

We can perform a vector operation called the dot productto directlycompute this cosine


20/60

As the angle of the lamp changeswith respect to the paper, the

number of photons coming from thelight are spread over a wider area.This results in the paper becomingdimmer.

At an angle of 0 degrees, thecosine of this angle is 1;

At 60 degrees, the cosine is one-half,

At 90 degrees the cosine is 0, nocontribution.


21/60

Light on a diffused sphere

Here the spheres normal changes with respect to the light. Thelights effect is at a maximum at the top of the sphere, goes tozero at the equator, and stays that way since the bottom of thesphere faces away from the light.


22/60


23/60

Common shading techniques

Flat shading

Gouraud Shading

Phong Shading


24/60

Gouraud Shading

A normal vector is calculated at each vertex.

Color is calculated for each vertex and interpolated acrossthe polygon


25/60


26/60

Polygon shading

techniques compared


27/60

transformation

A transform is an operation that changes

objects:Position called TRANSLATION

Orientation called ROTATION

or size and shape called SCALING


28/60

Translation

Remembering 2D transformations -> 3x3 matrices, take a wildguess what happens to 3D transformations.

This has the effect of taking the original point and adding thetranslation to it.

1000

100

010001

,,

100

10

01

,

z

y

x

z

y

x

zyx

y

x

y

x

yx

t

tt

t

t

t

z

y

x

tttT

t

t

t

t

y

xttT

T=(tx, ty, tz)


29/60

SCALING

1000

000

000

000

*

00

00

00

,,

100

00

00

*0

0,

z

y

x

z

y

x

zyx

y

x

y

x

yx

s

s

s

z

y

x

s

s

s

sssS

s

s

y

x

s

sssS

S=(sx, sy, sz)


30/60

Rotations about the Z axis

R=(0,0,1,)

What do you think the rotation matrix is forrotations about the z axis?

1000

0100

00cossin00sincos

),1,0,0(

100

0cossin0sincos

cossin

sincos

R

R


31/60

Rotations about the X axis

R=(1,0,0,)

Lets look at the other axis rotations

10000cossin0

0sincos0

0001

),0,0,1(

R


32/60

Rotations about the Y axis

R=(0,1,0,)

1000

0cos0sin

0010

0sin0cos

),0,1,0(

R


33/60

light

DIRECTIONAL LIGHT

This type of light is defined by just a direction vector.

A directional light is considered infinitely far away.

A point light

We define a position for it in space and it gives off light in alldirections.

Different from real-world lights in that, by default, the distance from alight does not affect its brightness.


34/60

Ambient Lighting

Light doesnt bounce around in our scenes but only affects what

it directly hits. Since theres no light bouncing around, it dies off

very quickly within our simplified system.

We compensate for this lack of reflected light, called indirectillumination, by adding a fudge factor, called ambient

lighting

The color is multiplied by the materials ambient color to give a

solid amount of fill color:


35/60


36/60

Shadow mapping contd

The depths of objects in the scene are stored in the shadowmap. This image is most like a regular scenes z-buffer,which stores the distances to objects


37/60

Spaces

The following spaces are there:

Object space (local space)

World space (global space)

Camera space


38/60

Camera Space

Lets say we want to render an image of a chair from acertain cameras point of view

The chair is placed in world space with matrixW

The camera is placed in world space with matrix C

The following transformation takes vertices from thechairs object space into world space, and then fromworld space into camera space:

vWCv 1


39/60

View matrix We dont want to position the camera with respect to the world,

we want to position the world with respect to the camera.

We use the inverse of the matrix that would position the camerain the world.

This inverse matrix is called the view matrix.


40/60

3D Synthetic Camera Model

The synthetic camera model involves two components,

specified independently:

objects (a.k.a geometry)

viewer (a.k.a camera)


41/60

projections

Now that we have the object transformed into a space relative to the

camera, we can focus on the next step, which is to project this 3D spaceinto a 2D image space.

A projection maps locations in the world to locations on the screen.

PARALLEL PROJECTION PERSPECTIVE PROJECTION


42/60


43/60


44/60

The Viewing Frustum Volume

Volume defined by:

Near Plane (n)

Far Plane (f)

Fields of view (fov)

For Perspective Projection


45/60

The Visible Volume

Only geometries (primitives) inside thevolume are visible

All geometries (primitives) outside areignored

Whatever lies outside the view volumeare Clipped!


46/60

Texture definitions

Texturethe appearance and feel of a surface

Texturean image used to define thecharacteristics of a surface

Texturea multidimensional image which ismapped to a multidimensional space

In computer graphics the word texture refersto any pattern or image applied to a surface to

change its color, shininess, or just about anyother part of its appearance


47/60


48/60

Texture mapping sample


49/60

Textures-basic concept

Take some location on a surface. Given that location, usesome functionto change the surface attributes at thatlocation

The most common way to apply a texture to a surface is to

use an image and glue it on, sort of like wallpaper

+ = =


50/60

Texture mapping

The way in which a model is associated with its texture iscalledtexture mapping.

How do we map a two-dimensional image to a surface inthree dimensions?

-Texture coordinates

2D coordinate (s,t) which maps to a location on the image

(typically s and t are over [0,1])

Assign a texture coordinate to each vertex

Coordinates are determined by some function whichmaps a texture location to a vertex on the model in threedimensions


51/60

Parametric texture mapping

Once a point on the surface of the model hasbeen mapped to a value in the texture, change its

RGB value (or something else!) accordingly

This is calledparametric texture mapping

A single point in the texture is called a texel


52/60


53/60


54/60


55/60

Cube mapping

Cube Mapping

Unwrap cube and map texture over the cube


56/60

Cylinder Mapping

Wrap texture along outside of cylinder, not topand bottom

This stops texture from being distorted


57/60

Simple Illumination

No illumination

Constant colors

Parallel light

Diffuse reflection


58/60


59/60

Texturing

2D Image Textures

Bump-Mapping

Reflection textures

Locally varyingobject characteristics


60/60

Thank you!!

interactive 3d graphics

Documents