lecture 4: 3d rendering pipeline (i)
DESCRIPTION
Lecture 4: 3D Rendering Pipeline (I). Prof. Hsien-Hsin Sean Lee School of Electrical and Computer Engineering Georgia Institute of Technology. Interactive Game Loop. Render Triangles (one frame). Game Input (Keyboard, Mouse). Physics Strategy, AI. 30 to 60 frames per second. Exit?. - PowerPoint PPT PresentationTRANSCRIPT
![Page 1: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/1.jpg)
Lecture 4: 3D Rendering Pipeline (I)
Prof. Hsien-Hsin Sean LeeSchool of Electrical and Computer
EngineeringGeorgia Institute of Technology
![Page 2: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/2.jpg)
Interactive Game Loop
Game Input(Keyboard,
Mouse)
PhysicsStrategy, AI
RenderTriangles
(one frame)
Exit?
CleanupStates
30 to 60 frames per second
![Page 3: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/3.jpg)
3D Graphics Rendering Pipeline
• Geometry Pipeline– Processing Vertices– Mainly floating-point operations
• Rasterization Pipeline– Processing Pixels– Mainly dealing with Integer
operations
Geometry Processing
xy
z
xy
z
xy
z
xy
z
xy
z
x
y
Rasterization Processing
x
y
![Page 4: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/4.jpg)
3D Graphics Rendering Pipeline
• Geometry Pipeline– Processing Vertices– Mainly floating-point operations
• Rasterization Pipeline– Processing Pixels– Mainly dealing with Integer operations– MMX was originally designed to
accelerate this functionality
Geometry Processing
xy
z
xy
z
xy
z
xy
z
xy
z
x
y
Rasterization Processing
x
y
MMX ISAMMX ISA
![Page 5: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/5.jpg)
3D Graphics Rendering Pipeline
• Geometry Pipeline– Processing Vertices– Mainly floating-point operations– SSE/SSE2 were designed for this
part• Rasterization Pipeline
– Processing Pixels– Mainly dealing with Integer operations– MMX was originally designed to
accelerate this functionality
Geometry Processing
xy
z
xy
z
xy
z
xy
z
xy
z
x
y
Rasterization Processing
x
y
MMXMMX ISAISASSE/SSE2 ISASSE/SSE2 ISA
![Page 6: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/6.jpg)
Fixed Function 3D Graphics Pipeline
• Geometry Pipeline– Processing Vertices– Mainly floating-point operations– SSE/SSE2 were designed for this
part• Rasterization Pipeline
– Processing Pixels– Mainly dealing with Integer operations– MMX was originally designed to
accelerate this functionality
Geometry Processing
xy
z
xy
z
xy
z
xy
z
xy
z
x
y
Rasterization Processing
x
yPerformed by (GP)GPU
![Page 7: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/7.jpg)
3D Coordinates
• Left-handed system is more common for graphics viewing space
• Camera or viewer position can be set up using 3D API
+z
+x
+y
Right-Handed System
+z
+x
+y
Left-Handed System
![Page 8: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/8.jpg)
Geometry Format ─ Vertex Coordinates
(X1, Y1, Z1)
(X2, Y2, Z2)
(X3, Y3, Z3)
+Z
+X
+Y
X1
Z1
Y1
![Page 9: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/9.jpg)
Geometry Format ─ Vertex Normals
(NX1, NY1, NZ1)
(NX2, NY2, NZ2)
(NX3, NY3, NZ3)
+Z
+X
+Y
![Page 10: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/10.jpg)
Geometry Format ─ Vertex Colors
(R1, G1, B1, A1)
(R2, G2, B2, A2)
(R3, B3, B3, G3)
+Z
+X
+Y
![Page 11: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/11.jpg)
Triangle-based Geometry Representation
V5V4
V3
V2
V1
V1V2
V3V4
V5
V6V7
V8
V9
V5V4
V1V1
V3
V2
Triangle List(note the vertex order)
Triangle Strip Triangle Fan
![Page 12: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/12.jpg)
Specifying a 3D object
• Vertex ordering is critical
V1
V2 V3
V4
V5
V6V7Triangle list{v1, v3, v2},{v1, v5, v3},{v5, v6, v3},{v4, v3, v6},{v1, v7, v6},{v1, v6, v5}
Triangle strip{v5, v3, v1, v2},{v5, v6, v3, v4},{v7, v6, v1, v5}
![Page 13: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/13.jpg)
V8
Specifying a 3D object
• Vertex ordering is critical• We will discuss normal computation later in this lecture
V1
V2 V3
V4
V6V7Triangle list{v1, v2, v7},{v2, v8, v7},{v2, v3, v4},{v2, v4, v8},{v4, v7, v8},{v4, v6, v7}
Triangle strip{v1, v2, v7, v8},{v3, v4, v2, v8},{v6, v7, v4, v8}
![Page 14: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/14.jpg)
3D Rendering Pipeline
Clip
ping
Pers
pect
ive D
ivide
View
port
Tran
sfor
m
Rast
eriza
tion
Proj
ectio
n Tr
ansf
orm
Wor
ld T
rans
form
View
Tra
nsfo
rm
Ligh
ting
Back
face
Cul
ling
![Page 15: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/15.jpg)
Transformation Pipeline• World Transformation
– Model coordinates World coordinates
• View Transformation– World coordinates Camera space
• Projection Transformation – Camera space View Plane
• These are a series of matrix multiplications
![Page 16: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/16.jpg)
World Transformation
• Translation• Rotation• Scaling
+x
+z
+y
World origin
World Coordinates
Local model coordinates
Local model coordinates
![Page 17: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/17.jpg)
View Transformation
+x
+z
+y
World origin
World Coordinates
+y
+x
+z
• Camera position• Look vector
![Page 18: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/18.jpg)
Projection Transformation• Set up camera internals
• Set up – Field of View (FOV)– View frustum – View planes
• Will discuss later
![Page 19: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/19.jpg)
Homogeneous Coordinates• Enable all transformations to be done
by “multiplication” – Primarily for translation (See next few
slides)
• Add one coordinate (w) to a 3D vector
• Each vertex has [x, y, z, w]– W will be useful for perspective projection– W should be 1 in a Cartesian Coordinate
System
![Page 20: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/20.jpg)
Transformation 1: Translation (Offset)
+x
+z
+y
+x
+z
+y
(x, y, z)
(xt, yt, zt)
![Page 21: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/21.jpg)
Translation Matrix
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
⋅=
1TTT
0100
0010
0001
]z,1y,x,[],1z,y,x[
zyx
ttt
![Page 22: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/22.jpg)
Transformation 2: Scaling
+x
+z
+y
+x
+z
+y
![Page 23: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/23.jpg)
Scaling Matrix
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
⋅=
1000
0R00
00R0
000R
]z,1y,x,[],1z,y,x[z
y
x
rrr
![Page 24: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/24.jpg)
Transformation 3: Rotation
+x
+z
+y
+y
+x
+z
![Page 25: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/25.jpg)
2D Rotation
+x
+y
+x
+y
(x, y)
(x’, y’)
+x
+y
(x, y)
⎥⎥⎥
⎦
⎤
⎢⎢⎢
⎣
⎡−⋅=
100
0cossin
0sincos
]y,1x,[],1y',x'[ èè
èè
Rotate along which axis?
![Page 26: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/26.jpg)
3D Rotation Matrix
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡−
⋅=
1000
0100
00cossin
00sincos
]z,1y,x,[],1z',y',x'[èè
èè
Rotation along Z axis
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡ −
⋅=
1000
0cos0sin
0010
0sin0cos
]z,1y,x,[],1z',y',x'[θθ
θè
Rotation along Y axis
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
−⋅=
1000
0cossin0
0sincos0
0001
]z,1y,x,[],1z',y',x'[èè
èèRotation along X axis
![Page 27: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/27.jpg)
Non-Commutative Property (1)
1. Counter-clockwise 90o along y
2. Clockwise 90o along x
+x
+z
+y
+x
+z
+y
1. Clockwise 90o along x
2. Counter-clockwise 90o along y
![Page 28: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/28.jpg)
Non-Commutative Property (1)
+x
+z
+y
+x
+z
+y
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
−
−
=
⎥⎥⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢⎢⎢
⎣
⎡
−⋅
⎥⎥⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢⎢⎢
⎣
⎡
−−
−−−
1000
0001
0100
0010
1000
0)2
cos()2
sin(0
0)2
sin()2
cos(0
0001
1000
0)2
cos(0)2
sin(
0010
0)2
sin(0)2
cos(
ππ
ππ
ππ
ππ
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
−−
=
⎥⎥⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢⎢⎢
⎣
⎡
−−
−−−
⋅
⎥⎥⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢⎢⎢
⎣
⎡
−1000
0010
0001
0100
1000
0)2
cos(0)2
sin(
0010
0)2
sin(0)2
cos(
1000
0)2
cos()2
sin(0
0)2
sin()2
cos(0
0001
ππ
ππ
ππ
ππ
(x’’, y’’, z’’) = (-z, -x, y)
(x’’, y’’, z’’) = (-y, -z, x)
![Page 29: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/29.jpg)
Non-Commutative Property (2)
1. Translation by (x, y, z)2. Scale by 2 times
+x
+z
+y
1. Scale by 2 times2. Translation by (x, y, z)
+x
+z
+y
![Page 30: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/30.jpg)
Non-Commutative Property (2)
+x
+z
+y
+x
+z
+y
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
=
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
⋅
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
1
000
000
000
1000
000
000
000
1
0100
0010
0001
RzTzRyTyRxTx
Rz
Ry
Rx
Rz
Ry
Rx
TzTyTx
(x’’, y’’, z’’) = (x*Rx+Rx*Tx, y*Ry+Ry*Ty, z*Rz+Rz*Tz)
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
=
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
⋅
⎥⎥⎥⎥
⎦
⎤
⎢⎢⎢⎢
⎣
⎡
1
000
000
000
1
0100
0010
0001
1000
000
000
000
TzTyTx
Rz
Ry
Rx
TzTyTx
Rz
Ry
Rx
(x’’, y’’, z’’) = (x*Rx+Tx, y*Ry+Ty, z*Rz+Tz)
Offsets were scaled as well
![Page 31: Lecture 4: 3D Rendering Pipeline (I)](https://reader033.vdocument.in/reader033/viewer/2022051416/56812e3c550346895d93b436/html5/thumbnails/31.jpg)
Non-Commutative Property• Ordering matters !
• Be careful when performing matrix multiplication