Transformation Pipeline

Split complex transformation from 3D to 2D into a sequence of simpler transformations.
We discussed model transformations before
Now we discuss view, projection, and viewport transformations

Transformation Pipeline

View Transformation
- setup extrinsic camera parameters: position and orientation
Projection Transformation
- setup intrinsic camera parameters: opening angle and depth range
Viewport Transformation
- setup image parameters/resolution: width and height

Transformation Pipeline

Model coordinates
- local coordinate system for each model
World coordinates
- one global coordinate system
Camera / eye coordinates
- world transformed to standard camera

images/coords_model.png model images/coords_world.png world images/coords_camera.png camera

Transformation Pipeline

Model coordinates
- local coordinate system for each model
World coordinates
- one global coordinate system
Camera / eye coordinates
- world transformed to standard camera
Normalized device coordinates
- viewing volume mapped to [-1,1]³
Window coordinates
- from [-1,1]³ to [-1,1]² to pixel coordinates

View Transformation

Specify extrinsic camera parameters
- Camera/eye location \(\vec{e}\)
- Viewing direction \(\vec{v}\)
- Up direction \(\vec{u}\)
- Right direction \(\vec{r}\)
- Assume \(\vec{v}\), \(\vec{u}\), \(\vec{r}\) are orthonormal

Transform scene to standard camera
- Camera/eye location \((0,0,0)\)
- Viewing direction \((0,0,-1)\)
- Up direction \((0,1,0)\)
- Right direction \((1,0,0)\)

View Transformation

Matrix from standard camera to \(\vec{e}, \vec{r}, \vec{u}, \vec{v}\):

\[ \matrix{ r_x & u_x & -v_x & e_x \\ r_y & u_y & -v_y & e_y \\ r_z & u_z & -v_z & e_z \\ 0 & 0 & 0 & 1 } \]

The inverse matrix does the job

\[ \matrix{ r_x & u_x & -v_x & e_x \\ r_y & u_y & -v_y & e_y \\ r_z & u_z & -v_z & e_z \\ 0 & 0 & 0 & 1 }^{-1} \;=\; \matrix{ r_x & r_y & r_z & 0 \\ u_x & u_y & u_z & 0 \\ -v_x & -v_y & -v_z & 0 \\ 0 & 0 & 0 & 1 } \cdot \matrix{ 1 & 0 & 0 & -e_x \\ 0 & 1 & 0 & -e_y \\ 0 & 0 & 1 & -e_z \\ 0 & 0 & 0 & 1 } \]

What is a projection?

In mathematics
- An idempotent mapping: \(\mat{P}\of{\mat{P}\of{\vec{x}}} = \mat{P}\of{\vec{x}}\)
In computer graphics
- A mapping from 3D space to a planar 2D image
- Parallel or perspective projection
- Transforms viewing volume to
  normalized device coordinates \([-1,1]^3\)

Classification of Projections

Parallel vs. Perspective Projection

images/3ds-max.png — Autodesk 3D Studio Max

Image from Wikipedia

Parallel vs. Perspective Projection

Parallel projections
- One direction of projection for all points
- Orthographic: direction perpendicular to image plane
- Preserve parallelism & lengths
- Used in technical applications

Perspective projections
- Each point projects towards center of projection
- Perspective foreshortening, realistic appearance
- Typically used in graphics applications

Generic Orthographic Projection

Standard camera setup
- located at origin
- looking down negative z-axis

Orthogonal projection onto xy-plane
- xy-coordinates do not change
- remove z-coordinate

\[ \matrix{ 1 & 0 & 0 & 0 \\ 0 & 1 & 0 & 0 \\ 0 & 0 & 0 & 0 \\ 0 & 0 & 0 & 1 } \]

OpenGL Orthographic Projection

Specify viewing volume as axis-aligned box \[ [l,r] \times [b,t] \times [-n,-f] \]
with left/right, bottom/top, near/far boundaries
Map viewing box to unit cube \([-1,1]^3\)
- translate box center to origin
- scale box dimensions to \(2 \times 2 \times 2\)
- z values should be mirrored

\[ \matrix{ \frac{2}{r-l} & 0 & 0 & 0 \\ 0 & \frac{2}{t-b} & 0 & 0 \\ 0 & 0 & \frac{-2}{f-n} & 0 \\ 0 & 0 & 0 & 1 } \cdot \matrix{ 1 & 0 & 0 & -\frac{l+r}{2} \\ 0 & 1 & 0 & -\frac{b+t}{2} \\ 0 & 0 & 1 & -\frac{-n-f}{2} \\ 0 & 0 & 0 & 1 } \;=\; \matrix{ \frac{2}{r-l} & 0 & 0 & -\frac{l+r}{r-l} \\ 0 & \frac{2}{t-b} & 0 & -\frac{b+t}{t-b} \\ 0 & 0 & \frac{-2}{f-n} & -\frac{n+f}{f-n} \\ 0 & 0 & 0 & 1 } \]

Generic Perspective Projection

Standard projection
- Center of projection: \((0,0,0)\)
- Image plane at \(z=-d\)

\[ \vector{x\\y\\z} \;\mapsto\; \vector{x \cdot \frac{-d}{z} \\ y \cdot \frac{-d}{z} \\ -d} \quad\stackrel{?}{\longleftrightarrow}\quad \matrix{ ? & ? & ? & ? \\ ? & ? & ? & ? \\ ? & ? & ? & ? \\ ? & ? & ? & ? } \cdot \vector{x\\y\\z\\1} \]

Do not put \(z\) in the matrix!

Homogeneous Coordinates

Use homogeneous coordinates \((x,y,z,w)\)!
- Vectors are represented by \(\transpose{(x,y,z,0)}\)
- Points are represented by \(\transpose{(wx,wy,wz,w)}\) for any \(w \neq 0\)
- Divide a point \(\transpose{(wx,wy,wz,w)}\) by \(w\) to get its canonical representation \(\transpose{(x,y,z,1)}\) (“homogenization”)

Geometric interpretation
- Points: lines through origin
- Vectors: points at infinity

Generic Perspective Projection

Standard projection
- Center of projection: \((0,0,0)\)
- Image plane at \(z=-d\)

\[ \vector{x\\y\\z} \;\mapsto\; \vector{x \cdot \frac{-d}{z} \\ y \cdot \frac{-d}{z} \\ -d} \quad\longleftrightarrow\quad \matrix{ 1 & 0 & 0 & 0 \\ 0 & 1 & 0 & 0 \\ 0 & 0 & 1 & 0 \\ 0 & 0 & -1/d & 0 } \cdot \vector{x\\y\\z\\1} \;=\; \vector{x\\y\\z\\-z/d} \;\cong\; \vector{x \frac{-d}{z} \\ y \frac{-d}{z} \\ -d\\ 1} \]

Homogeneous Coordinates

Use homogeneous coordinates \((x,y,z,w)\)!
- Vectors are represented by \(\transpose{(x,y,z,0)}\)
- Points are represented by \(\transpose{(wx,wy,wz,w)}\) for any \(w \neq 0\)
Divide a point \(\transpose{(wx,wy,wz,w)}\) by \(w\) to get its canonical representation \(\transpose{(x,y,z,1)}\) (“homogenization”)
- Defer homogenization until the very last step
We can now use \(4 \times 4\) matrices for
- linear transformations (scaling, rotation)
- affine transformations (linear map + translation)
- projective transformations (affine map + projection)

OpenGL Perspective Projection

Specify viewing volume by
- near and far
- left and right (or opening angle in x)
- bottom and top (or opening angle in y)

Transform this frustum to unit cube [-1,1]³
- so-called frustum mapping

Then perform parallel projection onto xy-plane and viewport transformation

Frustum Mapping

Frustum Mapping

images/frustum-1.png images/frustum-2.png

How to transform \((x,y,z)\)?

\[ \begin{eqnarray*} x &\mapsto& \left( x \frac{n}{-z} - \frac{l+r}{2} \right) \cdot \frac{2}{r-l} \\[2mm] y &\mapsto& \left( y \frac{n}{-z} - \frac{b+t}{2} \right) \cdot \frac{2}{t-b} \end{eqnarray*} \]

Matrix representation:

\[ \matrix{ \frac{2n}{r-l} & 0 & \frac{l+r}{r-l} & 0 \\ 0 & \frac{2n}{t-b} & \frac{b+t}{t-b} & 0 \\ ? & ? & ? & 0 \\ 0 & 0 & -1 & 0 } \]

Frustum Mapping

images/frustum-1.png images/frustum-2.png

How to transform \((x,y,z)\)?

\[ \begin{eqnarray*} z &\mapsto& \frac{a \cdot z + b}{-z} \end{eqnarray*} \]

such that

\[-n \mapsto -1 \;,\quad -f \mapsto +1\]

This leads to

\[ a = -\frac{n+f}{f-n} \;,\quad b = -\frac{2nf}{f-n} \]

Matrix representation:

\[ \matrix{ \frac{2n}{r-l} & 0 & \frac{l+r}{r-l} & 0 \\ 0 & \frac{2n}{t-b} & \frac{b+t}{t-b} & 0 \\ 0 & 0 & -\frac{n+f}{f-n} & -\frac{2nf}{f-n} \\ 0 & 0 & -1 & 0 } \]

Frustum Mapping

images/frustum-1.png images/frustum-2.png

Check frustum corners, e.g.:

\[ \begin{eqnarray*} \transpose{(l,b,-n)} &\mapsto& \transpose{(-1,-1,-1)} \\[2mm] \transpose{(r,t,-n)} &\mapsto& \transpose{(+1,+1,-1)} \\[2mm] \transpose{(l\frac{f}{n},b\frac{f}{n},-f)} &\mapsto& \transpose{(-1,-1,+1)} \\[2mm] \transpose{(r\frac{f}{n},t\frac{f}{n},-f)} &\mapsto& \transpose{(+1,+1,+1)} \\[2mm] \end{eqnarray*} \]

Matrix representation:

\[ \matrix{ \frac{2n}{r-l} & 0 & \frac{l+r}{r-l} & 0 \\ 0 & \frac{2n}{t-b} & \frac{b+t}{t-b} & 0 \\ 0 & 0 & -\frac{n+f}{f-n} & -\frac{2nf}{f-n} \\ 0 & 0 & -1 & 0 } \]

Viewport Mapping

Simple scaling of normalized device coordinates \[ [-1,1] \times [-1,1] \times [-1,1] \]
to window pixel coordinates \[ [l, l+w] \times [b,b+h] \times [0,1] \]
Matrix representation \[ \matrix{ \frac{w}{2} & 0 & 0 & \frac{w}{2}+l \\ 0 & \frac{h}{2} & 0 & \frac{h}{2}+b \\ 0 & 0 & \frac{1}{2} & \frac{1}{2} \\ 0 & 0 & 0 & 1 } \]

Transformation Pipeline

View Transformation
- setup extrinsic camera parameters: position and orientation
Projection Transformation
- setup intrinsic camera parameters: opening angle and depth range
Viewport Transformation
- setup image parameters/resolution: width and height

Try it yourself!

Model transformation \(\mat{M} = \mat{R}_y\of{\cdot} \, \mat{T}_z\of{\cdot} \, \mat{S}_x\of{\cdot}\)

Invariance

Which properties are invariant under which transformations?
- Properties
  - Position, Length, Angles, Area, Orientation, Straight Lines, Parallel Lines, Circles, Ellipses, Ratios
- Transformations
  - Identity, Translation, Rotation, Uniform Scaling, Non-uniform Scaling, Shear, Reflection, Orthographic Projection, Perspective Projection

Literature

Akenine-Möller, Haines, Hoffman: Real-Time Rendering, Taylor & Francis, 2008.
- Chapter 4

Shreiner, Seller, Kessenich, Licea-Kane: OpenGL Programming Guide, 2013.
- Chapter 3

Paul Bourke, University of Western Australia: http://paulbourke.net/stereographics/

Computer Graphics

Projections

Transformation Pipeline

Transformation Pipeline

Transformation Pipeline

Transformation Pipeline

View Transformation

View Transformation

View Transformation

Projections

What is a projection?

Classification of Projections

Parallel vs. Perspective Projection

Parallel vs. Perspective Projection

Generic Orthographic Projection

OpenGL Orthographic Projection

Generic Perspective Projection

Homogeneous Coordinates

Generic Perspective Projection

Homogeneous Coordinates

OpenGL Perspective Projection

Frustum Mapping

Frustum Mapping

Frustum Mapping

Frustum Mapping

Viewport Transform

Viewport Mapping

Transformation Pipeline

Try it yourself!

Invariance

Literature