SlideShare a Scribd company logo
2
Most read
8
Most read
SBE 306: Computer Graphics
Projection
Dr. Ayman Eldeib
Systems & Biomedical
Engineering Department
Spring 2019
Computer Graphics Projection
Types of Projections
Perspective
Projection
Parallel
Projection
“Orthographic ”
Computer Graphics Projection
Simple Orthographic Projection
 Project all points along the z axis to the z= 0 plane





































11000
0000
0010
0001
1
0
'
'
z
y
x
y
x
Computer Graphics Projection
Perspective Transformations
 Perspective transformations do not preserve parallelism,
i.e. Parallel lines not parallel; converge to single point
 Further objects are smaller (size, inverse distance)
B
A’
B’
Center of projection
(camera/eye location)
A
Computer Graphics Projection
Perspective Projection
 In the real world, objects exhibit perspective
foreshortening: distant objects appear smaller.
 The basic situation:
Computer Graphics Projection
 When we do 3-D graphics, we think of the screen as a 2-D
window onto the 3-D world
How tall
should
this bunny
be?
Cont.
Perspective Projection
Computer Graphics Projection
 The geometry of the situation is that of similar triangles.
View from above:
P (x, y, z)X
-Z
View
plane
d
(0,0,0) x’ = ?
 What is x’ ?
Cont.
Perspective Projection
Computer Graphics Projection
P (x, y, z)X
-Z
View
plane
d
(0,0,0) x’ = ?
z
y
d
y
z
x
d
x

'
,
'
dz
dz
y
z
yd
y
dz
x
z
xd
x 



 ',','
Cont.
Perspective Projection
Computer Graphics Projection
A Perspective Projection Matrix
z
y
d
y
z
x
d
x

'
,
'
dz
dz
y
z
yd
y
dz
x
z
xd
x 



 ',','















d
z
z
y
x
































1
1
'
'
'
d
z
yd
z
xd
z
y
x


























 10
1
00
0100
0010
0001
z
y
x
d
Perspective Matrix
Computer Graphics Projection
Example














0100
0100
0010
0001
d
M eperspectiv






































 dz
z
y
x
z
y
x
d 10100
0100
0010
0001
Cont.
A Perspective Projection Matrix
Computer Graphics Projection
P (x, y, z)X
-Z
View
plane
d
(0,0,0) x’ = ?














0100
0100
0010
0001
d
M eperspectiv
 View plane is at –d on z coordinate
 (Only) last row affected (no longer 0 0 0 1)
Cont.
A Perspective Projection Matrix
Computer Graphics Projection
 Now that we can express perspective
foreshortening as a matrix, we can composite it
onto our other matrices with the usual matrix
multiplication
 End result: can create a single matrix
encapsulating modeling, viewing, and projection
transforms
Though you recall that in practice OpenGL
separates the modelview from projection
matrix (why?)
Cont.
A Perspective Projection Matrix
Computer Graphics Projection
Defining a Viewing Region
 Most graphics API’s use two methods for defining a
viewing region
 The viewing frustum
In OpenGL glFrustum (xmin,xmax,ymin,ymax,near,far)
 The screen projection plane
This is a special case of the viewing frustum
Also called the symmetric perspective projection frustum
In OpenGL gluPerspective (theta,aspect,near,far)
Computer Graphics Projection
Viewing Frustum
 void glFrustum( GLdouble left,
GLdouble right, GLdouble
bottom, GLdouble top, GLdouble
near, GLdouble far )
 Parameters:
 left, right: Specify the
coordinates for the left and
right vertical clipping planes;
 bottom, top: Specify the
coordinates for the bottom
and top horizontal clipping
planes;
 near, far: Specify the
distances to the near and far
depth clipping planes. Both
distances must be positive.
Computer Graphics Projection
 void gluPerspective( GLdouble fovy,
GLdouble aspect, GLdouble zNear,
GLdouble zFar )
 Parameters:
 Fovy: Specifies the field of view
angle, in degrees, in the y
direction;
 Aspect: Specifies the aspect ratio
that determines the field of view in
the x direction. The aspect ratio is
the ratio of x (width) to y (height);
 ZNear: Specifies the distance from
the viewer to the near clipping
plane (always positive);
 ZFar: Specifies the distance from
the viewer to the far clipping plane
(always positive)
Cont.
Viewing Frustum
Computer Graphics Projection
 The viewing frustum defines a region of 3D space
assuming that the eye is located at (0, 0, 0).
 A 4x4 perspective transformation maps the
viewing frustum to a canonical cube
 Once a canonical cube is obtained 3D points are
projected to 2D by dropping the z component
 Note perspective projection is obtained by using
a perspective transformation followed by
orthographic projection
Cont.
Viewing Frustum
Computer Graphics Projection
 OpenGL’s gluPerspective() command generates a
slightly more complicated matrix:














































2
cotwhere
0100
2
00
000
000
y
farnear
nearfar
farnear
nearfar
fov
f
ZZ
ZZ
ZZ
ZΖ
f
aspect
f
Cont.
Viewing Frustum
Thank You

More Related Content

PPT
Polygon clipping
Mohd Arif
 
PPTX
Computer graphics basic transformation
Selvakumar Gna
 
PPTX
Bresenham's line drawing algorithm
nehrurevathy
 
PPTX
Polygon filling algorithm
Aparna Joshi
 
PPTX
Character Attribute in computer graphics
HariTharshiniBscIT1
 
PDF
Unit 3
ypnrao
 
PPTX
Weiler atherton
Arvind Kumar
 
PPTX
The sutherland hodgeman polygon clipping algorithm
Mani Kanth
 
Polygon clipping
Mohd Arif
 
Computer graphics basic transformation
Selvakumar Gna
 
Bresenham's line drawing algorithm
nehrurevathy
 
Polygon filling algorithm
Aparna Joshi
 
Character Attribute in computer graphics
HariTharshiniBscIT1
 
Unit 3
ypnrao
 
Weiler atherton
Arvind Kumar
 
The sutherland hodgeman polygon clipping algorithm
Mani Kanth
 

What's hot (20)

PDF
3D Transformation
SwatiHans10
 
PPTX
Cohen sutherland line clipping
Mani Kanth
 
PPTX
Computer graphics
Nanhen Verma
 
PPT
Polygon clipping
Ankit Garg
 
PPT
Window to viewport transformation
Ankit Garg
 
PPT
Shading
Amit Kapoor
 
PPTX
3 d display methods
Shami Al Rahad
 
PPT
Circle drawing algo.
Mohd Arif
 
PPTX
3 d viewing projection
Pooja Dixit
 
PPTX
3D Display
Toushik Paul
 
PPTX
Window to viewport transformation&matrix representation of homogeneous co...
Mani Kanth
 
PPTX
2 d viewing computer graphics
KALESHWAR KUMAR
 
PPT
Composite transformations
Mohd Arif
 
PPTX
Clipping
AMIT VIRAMGAMI
 
PPTX
Projections.pptx
jyoti_lakhani
 
PPTX
Graph in data structure
Abrish06
 
PPTX
Character generation techniques
Mani Kanth
 
PPT
2D transformation (Computer Graphics)
Timbal Mayank
 
PPTX
Concept of basic illumination model
Ankit Garg
 
PPT
Line drawing algo.
Mohd Arif
 
3D Transformation
SwatiHans10
 
Cohen sutherland line clipping
Mani Kanth
 
Computer graphics
Nanhen Verma
 
Polygon clipping
Ankit Garg
 
Window to viewport transformation
Ankit Garg
 
Shading
Amit Kapoor
 
3 d display methods
Shami Al Rahad
 
Circle drawing algo.
Mohd Arif
 
3 d viewing projection
Pooja Dixit
 
3D Display
Toushik Paul
 
Window to viewport transformation&matrix representation of homogeneous co...
Mani Kanth
 
2 d viewing computer graphics
KALESHWAR KUMAR
 
Composite transformations
Mohd Arif
 
Clipping
AMIT VIRAMGAMI
 
Projections.pptx
jyoti_lakhani
 
Graph in data structure
Abrish06
 
Character generation techniques
Mani Kanth
 
2D transformation (Computer Graphics)
Timbal Mayank
 
Concept of basic illumination model
Ankit Garg
 
Line drawing algo.
Mohd Arif
 
Ad

Similar to 3 projection computer graphics (20)

PDF
Notes04.pdf
MukeshKumar605825
 
PDF
MODULE-5 notes [BCG402-CG&V] PART-B.pdf
Alvas Institute of Engineering and technology, Moodabidri
 
PPTX
3 d graphics with opengl part 2
Sardar Alam
 
PPT
projections - engineering drawing
Krishna Gali
 
PPT
3 d
Arif Hidayat
 
PPT
Three dimensional concepts - Computer Graphics
Kongunadu College of engineering and Technology, Namakkal
 
PPT
Lecture3.orig.ppt
AnishMonTS
 
PDF
6. Perspective Projection .pdf
Yatru Harsha Hiski
 
PDF
Computer Graphics - Lecture 03 - Virtual Cameras and the Transformation Pipeline
💻 Anton Gerdelan
 
PDF
Cs543 15 projection
kandyfloor
 
PPT
CS 354 Graphics Math
Mark Kilgard
 
PPT
3 d viewing
Deepak Singh
 
PPT
Computer Viewing
Syed Zaid Irshad
 
PPT
viewing-projection powerpoint cmputer graphics
SUBHASHREEBASU5
 
PPT
Projection Matrices
Syed Zaid Irshad
 
PPT
3 d modeling part 1
Charles Flynt
 
PDF
unit-4-computer-graphics.pdf . VERY USE FULL
Pradeepgupta624665
 
PPT
View in 3_d_asper_syllabus
lokesh503
 
PPT
View in 3_d_asper_syllabus
lokesh503
 
PPT
Lec4
Sahil Dahiya
 
Notes04.pdf
MukeshKumar605825
 
MODULE-5 notes [BCG402-CG&V] PART-B.pdf
Alvas Institute of Engineering and technology, Moodabidri
 
3 d graphics with opengl part 2
Sardar Alam
 
projections - engineering drawing
Krishna Gali
 
Three dimensional concepts - Computer Graphics
Kongunadu College of engineering and Technology, Namakkal
 
Lecture3.orig.ppt
AnishMonTS
 
6. Perspective Projection .pdf
Yatru Harsha Hiski
 
Computer Graphics - Lecture 03 - Virtual Cameras and the Transformation Pipeline
💻 Anton Gerdelan
 
Cs543 15 projection
kandyfloor
 
CS 354 Graphics Math
Mark Kilgard
 
3 d viewing
Deepak Singh
 
Computer Viewing
Syed Zaid Irshad
 
viewing-projection powerpoint cmputer graphics
SUBHASHREEBASU5
 
Projection Matrices
Syed Zaid Irshad
 
3 d modeling part 1
Charles Flynt
 
unit-4-computer-graphics.pdf . VERY USE FULL
Pradeepgupta624665
 
View in 3_d_asper_syllabus
lokesh503
 
View in 3_d_asper_syllabus
lokesh503
 
Ad

More from cairo university (20)

PPSX
Tocci chapter 13 applications of programmable logic devices extended
cairo university
 
PPSX
Tocci chapter 12 memory devices
cairo university
 
PPSX
Tocci ch 9 msi logic circuits
cairo university
 
PPSX
Tocci ch 7 counters and registers modified x
cairo university
 
PPSX
Tocci ch 6 digital arithmetic operations and circuits
cairo university
 
PPSX
Tocci ch 3 5 boolean algebra, logic gates, combinational circuits, f fs, - re...
cairo university
 
PPSX
A15 sedra ch 15 memory circuits
cairo university
 
PPSX
A14 sedra ch 14 advanced mos and bipolar logic circuits
cairo university
 
PPSX
A13 sedra ch 13 cmos digital logic circuits
cairo university
 
PPSX
A09 sedra ch 9 frequency response
cairo university
 
PPTX
5 sedra ch 05 mosfet.ppsx
cairo university
 
PPSX
5 sedra ch 05 mosfet
cairo university
 
PPSX
5 sedra ch 05 mosfet revision
cairo university
 
PDF
Fields Lec 2
cairo university
 
PDF
Fields Lec 1
cairo university
 
PDF
Fields Lec 5&6
cairo university
 
PDF
Fields Lec 4
cairo university
 
PDF
Fields Lec 3
cairo university
 
PPT
Lecture 2 (system overview of c8051 f020) rv01
cairo university
 
PPT
Lecture 1 (course overview and 8051 architecture) rv01
cairo university
 
Tocci chapter 13 applications of programmable logic devices extended
cairo university
 
Tocci chapter 12 memory devices
cairo university
 
Tocci ch 9 msi logic circuits
cairo university
 
Tocci ch 7 counters and registers modified x
cairo university
 
Tocci ch 6 digital arithmetic operations and circuits
cairo university
 
Tocci ch 3 5 boolean algebra, logic gates, combinational circuits, f fs, - re...
cairo university
 
A15 sedra ch 15 memory circuits
cairo university
 
A14 sedra ch 14 advanced mos and bipolar logic circuits
cairo university
 
A13 sedra ch 13 cmos digital logic circuits
cairo university
 
A09 sedra ch 9 frequency response
cairo university
 
5 sedra ch 05 mosfet.ppsx
cairo university
 
5 sedra ch 05 mosfet
cairo university
 
5 sedra ch 05 mosfet revision
cairo university
 
Fields Lec 2
cairo university
 
Fields Lec 1
cairo university
 
Fields Lec 5&6
cairo university
 
Fields Lec 4
cairo university
 
Fields Lec 3
cairo university
 
Lecture 2 (system overview of c8051 f020) rv01
cairo university
 
Lecture 1 (course overview and 8051 architecture) rv01
cairo university
 

Recently uploaded (20)

PPT
1. SYSTEMS, ROLES, AND DEVELOPMENT METHODOLOGIES.ppt
zilow058
 
PPTX
Inventory management chapter in automation and robotics.
atisht0104
 
PDF
20ME702-Mechatronics-UNIT-1,UNIT-2,UNIT-3,UNIT-4,UNIT-5, 2025-2026
Mohanumar S
 
PDF
67243-Cooling and Heating & Calculation.pdf
DHAKA POLYTECHNIC
 
PDF
Unit I Part II.pdf : Security Fundamentals
Dr. Madhuri Jawale
 
PPTX
MT Chapter 1.pptx- Magnetic particle testing
ABCAnyBodyCanRelax
 
PDF
top-5-use-cases-for-splunk-security-analytics.pdf
yaghutialireza
 
PDF
Software Testing Tools - names and explanation
shruti533256
 
PPTX
Introduction of deep learning in cse.pptx
fizarcse
 
PPTX
business incubation centre aaaaaaaaaaaaaa
hodeeesite4
 
PDF
settlement FOR FOUNDATION ENGINEERS.pdf
Endalkazene
 
PDF
67243-Cooling and Heating & Calculation.pdf
DHAKA POLYTECHNIC
 
PDF
Packaging Tips for Stainless Steel Tubes and Pipes
heavymetalsandtubes
 
PPTX
IoT_Smart_Agriculture_Presentations.pptx
poojakumari696707
 
PPTX
22PCOAM21 Data Quality Session 3 Data Quality.pptx
Guru Nanak Technical Institutions
 
PPTX
MSME 4.0 Template idea hackathon pdf to understand
alaudeenaarish
 
PPTX
22PCOAM21 Session 1 Data Management.pptx
Guru Nanak Technical Institutions
 
PDF
2010_Book_EnvironmentalBioengineering (1).pdf
EmilianoRodriguezTll
 
PDF
Advanced LangChain & RAG: Building a Financial AI Assistant with Real-Time Data
Soufiane Sejjari
 
PPTX
Color Model in Textile ( RGB, CMYK).pptx
auladhossain191
 
1. SYSTEMS, ROLES, AND DEVELOPMENT METHODOLOGIES.ppt
zilow058
 
Inventory management chapter in automation and robotics.
atisht0104
 
20ME702-Mechatronics-UNIT-1,UNIT-2,UNIT-3,UNIT-4,UNIT-5, 2025-2026
Mohanumar S
 
67243-Cooling and Heating & Calculation.pdf
DHAKA POLYTECHNIC
 
Unit I Part II.pdf : Security Fundamentals
Dr. Madhuri Jawale
 
MT Chapter 1.pptx- Magnetic particle testing
ABCAnyBodyCanRelax
 
top-5-use-cases-for-splunk-security-analytics.pdf
yaghutialireza
 
Software Testing Tools - names and explanation
shruti533256
 
Introduction of deep learning in cse.pptx
fizarcse
 
business incubation centre aaaaaaaaaaaaaa
hodeeesite4
 
settlement FOR FOUNDATION ENGINEERS.pdf
Endalkazene
 
67243-Cooling and Heating & Calculation.pdf
DHAKA POLYTECHNIC
 
Packaging Tips for Stainless Steel Tubes and Pipes
heavymetalsandtubes
 
IoT_Smart_Agriculture_Presentations.pptx
poojakumari696707
 
22PCOAM21 Data Quality Session 3 Data Quality.pptx
Guru Nanak Technical Institutions
 
MSME 4.0 Template idea hackathon pdf to understand
alaudeenaarish
 
22PCOAM21 Session 1 Data Management.pptx
Guru Nanak Technical Institutions
 
2010_Book_EnvironmentalBioengineering (1).pdf
EmilianoRodriguezTll
 
Advanced LangChain & RAG: Building a Financial AI Assistant with Real-Time Data
Soufiane Sejjari
 
Color Model in Textile ( RGB, CMYK).pptx
auladhossain191
 

3 projection computer graphics

  • 1. SBE 306: Computer Graphics Projection Dr. Ayman Eldeib Systems & Biomedical Engineering Department Spring 2019
  • 2. Computer Graphics Projection Types of Projections Perspective Projection Parallel Projection “Orthographic ”
  • 3. Computer Graphics Projection Simple Orthographic Projection  Project all points along the z axis to the z= 0 plane                                      11000 0000 0010 0001 1 0 ' ' z y x y x
  • 4. Computer Graphics Projection Perspective Transformations  Perspective transformations do not preserve parallelism, i.e. Parallel lines not parallel; converge to single point  Further objects are smaller (size, inverse distance) B A’ B’ Center of projection (camera/eye location) A
  • 5. Computer Graphics Projection Perspective Projection  In the real world, objects exhibit perspective foreshortening: distant objects appear smaller.  The basic situation:
  • 6. Computer Graphics Projection  When we do 3-D graphics, we think of the screen as a 2-D window onto the 3-D world How tall should this bunny be? Cont. Perspective Projection
  • 7. Computer Graphics Projection  The geometry of the situation is that of similar triangles. View from above: P (x, y, z)X -Z View plane d (0,0,0) x’ = ?  What is x’ ? Cont. Perspective Projection
  • 8. Computer Graphics Projection P (x, y, z)X -Z View plane d (0,0,0) x’ = ? z y d y z x d x  ' , ' dz dz y z yd y dz x z xd x      ',',' Cont. Perspective Projection
  • 9. Computer Graphics Projection A Perspective Projection Matrix z y d y z x d x  ' , ' dz dz y z yd y dz x z xd x      ',','                d z z y x                                 1 1 ' ' ' d z yd z xd z y x                            10 1 00 0100 0010 0001 z y x d Perspective Matrix
  • 10. Computer Graphics Projection Example               0100 0100 0010 0001 d M eperspectiv                                        dz z y x z y x d 10100 0100 0010 0001 Cont. A Perspective Projection Matrix
  • 11. Computer Graphics Projection P (x, y, z)X -Z View plane d (0,0,0) x’ = ?               0100 0100 0010 0001 d M eperspectiv  View plane is at –d on z coordinate  (Only) last row affected (no longer 0 0 0 1) Cont. A Perspective Projection Matrix
  • 12. Computer Graphics Projection  Now that we can express perspective foreshortening as a matrix, we can composite it onto our other matrices with the usual matrix multiplication  End result: can create a single matrix encapsulating modeling, viewing, and projection transforms Though you recall that in practice OpenGL separates the modelview from projection matrix (why?) Cont. A Perspective Projection Matrix
  • 13. Computer Graphics Projection Defining a Viewing Region  Most graphics API’s use two methods for defining a viewing region  The viewing frustum In OpenGL glFrustum (xmin,xmax,ymin,ymax,near,far)  The screen projection plane This is a special case of the viewing frustum Also called the symmetric perspective projection frustum In OpenGL gluPerspective (theta,aspect,near,far)
  • 14. Computer Graphics Projection Viewing Frustum  void glFrustum( GLdouble left, GLdouble right, GLdouble bottom, GLdouble top, GLdouble near, GLdouble far )  Parameters:  left, right: Specify the coordinates for the left and right vertical clipping planes;  bottom, top: Specify the coordinates for the bottom and top horizontal clipping planes;  near, far: Specify the distances to the near and far depth clipping planes. Both distances must be positive.
  • 15. Computer Graphics Projection  void gluPerspective( GLdouble fovy, GLdouble aspect, GLdouble zNear, GLdouble zFar )  Parameters:  Fovy: Specifies the field of view angle, in degrees, in the y direction;  Aspect: Specifies the aspect ratio that determines the field of view in the x direction. The aspect ratio is the ratio of x (width) to y (height);  ZNear: Specifies the distance from the viewer to the near clipping plane (always positive);  ZFar: Specifies the distance from the viewer to the far clipping plane (always positive) Cont. Viewing Frustum
  • 16. Computer Graphics Projection  The viewing frustum defines a region of 3D space assuming that the eye is located at (0, 0, 0).  A 4x4 perspective transformation maps the viewing frustum to a canonical cube  Once a canonical cube is obtained 3D points are projected to 2D by dropping the z component  Note perspective projection is obtained by using a perspective transformation followed by orthographic projection Cont. Viewing Frustum
  • 17. Computer Graphics Projection  OpenGL’s gluPerspective() command generates a slightly more complicated matrix:                                               2 cotwhere 0100 2 00 000 000 y farnear nearfar farnear nearfar fov f ZZ ZZ ZZ ZΖ f aspect f Cont. Viewing Frustum