Depth



     





Depth Cues

"Hints" that suggest three-dimensionality - shape or distance

Based on physics, and workings of human vision






Summary






Occlusion / Interposition


Limbourg. Tres Riches Heures: January. 1412-16





Occlusion / Interposition


Hiroshige. Plum Estate, Kameido. 1857





Occlusion / Interposition


Diablo (Blizzard North, 1996)





Perspective






Linear Perspective


Jack Delano. Chicago Galewood yard. 1944





Linear Perspective


van Gogh. Corridor in the Asylum. 1889





Linear Perspective


Dali. The First Days of Spring 1932





Linear Perspective


Tempest (Atari, 1981)





Relative Size


Durer. The Adoration of the Magi. 1504





Relative Size


Monet. Wheatstacks (End of Summer), 1890-91





Relative Size


Wolfenstein 3D (id Software, 1992)





Relative Height


Limbourg. Tres Riches Heures: February. 1412-16





Relative Height


Constable. Chain Pier, Brighton. 1827





Relative Height


Marble Madness (Atari, 1984)





Texture Gradient


Gustave Caillebotte. Paris Street; Rainy Day. 1877





Texture Gradient


Gustave Caillebotte. Paris Street; Rainy Day (detail)





Texture Gradient


Turner Whitted. Ray Tracing. 1980





Lighting & Shadows


Michelangelo. David. 1504





Lighting & Shadows


Michelangelo. The Holy Family with the infant St. John the Baptist (the Doni Tondo). c. 1503-05





Lighting & Shadows


Monet. Rouen Cathedral, the West Portal and Saint-Romain Tower, Full Sunlight, Harmony in Blue and Gold) / Rouen Cathedral: Full Sunlight. 1894





Lighting & Shadows

    
Mario 64 (Nintendo, 1996)      /      Doom 3 (id Software, 2004)





Lighting & Shadows

Cel Shading





Aerial Perspective


Gregg M. Erickson. Mount Ellinor. CC-BY





Aerial Perspective


Friedrich. Riesengebirge. 1835





Aerial Perspective


Monet. The Thames at Westminster (Westminster Bridge). 1871





Aerial Perspective


Myst V (Ubisoft, 2005)





Accomodation (Focus)






Accomodation (Focus)


Vermeer. The Lacemaker. 1669-70





Accomodation (Focus)






Motion Parallax


Disney. The Old Mill. 1937





Motion Parallax


Shadow of the Beast (Psygnosis, 1989)





Stereo Parallax






Stereo Parallax






Stereo Parallax


Virtual Boy - Mario's Tennis (Nintendo, 1995)





OpenGL

occlusion
depth-buffering (glEnable(GL_DEPTH_TEST))

linear perspective
relative size
relative height
perspective projection (gluPerspective)

texture gradient
perspective, texture mapping (glTexImage2D, etc)

shading, shadows
lighting (glLight, glMaterial, glNormal)

aerial perspective
fog (glFog)

accomodation
accumulation buffer (glAccum)

stereo parallax
quad-buffering, color-masking

motion parallax
transformations





3D Coordinates

3D graphics adds a Z coordinate

OpenGL coordinate system is right-handed - +X to the right, +Y up, +Z out of screen

Other software or application domains may use other coordinate systems






3D Viewing

The 3D viewing volume is controlled by glOrtho.
This is an axis-aligned box containing the region to be drawn.



   glOrtho(left, right, bottom, top, near, far)

Note that near and far can be confusing - they are the negatives of the Z values for the corresponding planes.






glOrtho


glOrtho(-5, 8, -4, 4, -1, 3)






3D Transformations

All OpenGL transformation functions are 3D; we can now use the Z coordinate

glTranslatef(x, y, z)

Moves objects by (x, y, z) units.


glRotatef(angle, x, y, z)

Rotates objects around the axis (x, y, z), by angle degrees.

Note that "the axis (x, y, z)" means a line that from the origin (0, 0, 0) through the point (x, y, z)


glScalef(x, y, z)

Resizes objects by the factor x in the X direction, y in the Y direction, and z in the Z direction.






Hidden Surfaces

Hidden surfaces provide occlusion depth cue






Hidden Surface Algorithms

Many different algorithms developed over the years






Ray Tracing


CC-BY-SA diagram by Henrik





Depth Buffering

Rendering a polygon means filling pixels

Color buffer contains RGB color of each pixel drawn

Depth buffer contains depth of each pixel drawn

ColorDepth





Depth Buffer






Depth Buffer

When drawing a new pixel, compare new depth to what's stored in depth buffer

ColorDepth

Polygons can be drawn in any order
Polygons can intersect






OpenGL Depth Buffering

Space must be allocated for the depth buffer:

glutInitDisplayMode(GLUT_RGB|GLUT_DOUBLE|GLUT_DEPTH)

Depth buffering must be enabled:

glEnable(GL_DEPTH_TEST)

Depth buffer must be cleared each frame:

glClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT)





Depth Fighting

Depth values have limited resolution

i.e. the numbers are not infinitely precise

Rounding errors occur when polygons are filled

Polygon overlap can cause "depth-fighting"



Creative Commons License
This document is by Dave Pape, and is released under a Creative Commons License.