Viewing and Projection Transformations

Transcription

1 Viewing and Projection Transformations Projective Rendering Pipeline OCS WCS VCS modeling transformation viewing transformation OCS - object coordinate system WCS - world coordinate system VCS - viewing coordinate system CCS - clipping coordinate system NDCS - normalized device coordinate system DCS - device coordinate system projection transformation / h viewport transformation CCS NDCS DCS

2 Viewing Transformation Defining the camera position and orientation eye point reference point up vector three.js: camera.position.set(30,0,0); camera.up = new THREE.Vector3(0,0,); camera.lookat(0,0,0); // also: object.matrix.lookat(eye,center,up)

3 Computing i,j,k

4 Viewing Transformation M view

5 Projection Transformation M proj 3D scene à 2D image pinhole camera image plane real pinhole camera camera lens

6 Projection definition perspective projection parallel projection

7 Projections Taxonomy planar projections perspective:,2,3-point oblique parallel orthographic cabinet cavalier top, front, side axonometric isometric dimetric

8

9

10 Perspective Projection y P(x,y,z) P(x,y,d) z=d z

11 Homogeneous Coordinates homogeneous cartesian ( x, y, z, h) redundant representation h=0: point at infinity (direction) geometric interpretation h P( x, y, z, h)

12 Perspective Projection A simple version of h / = / - z y x d M proj

13 Projective Rendering Pipeline OCS WCS VCS modeling transformation LookAt() viewing transformation OCS - object coordinate system WCS - world coordinate system VCS - viewing coordinate system CCS - clipping coordinate system NDCS - normalized device coordinate system DCS - device coordinate system projection transformation / h alter h viewport transformation CCS NDCS DCS

14 View Volumes: more about M proj specifies field-of-view, used for clipping restricts domain of z stored for visibility test orthographic view volume perspective view volume

15 View Volumes OpenGL / WebGL canonical view volume

16 Orthographic View Volume

17 Orthographic View Volume 2 right left 2 top bot 2 far near right + left right left top + bot top bot far + near far near three.js var cam = new THREE.OrthographicCamera(left,right,top,bot,near,far)

18 Orthographic View Volume Derivation solving for a and b gives:

19 Perspective View Volume

20 Perspective View Volume Derivation x y z z / d = / d x y z earlier: with additional ability to scale, etc.: = ' ' ' ' z y x D C B F A E h z y x

21 Perspective View Volume ) ( 2 2 n f fn n f f b n t b t b t n l r l r l r n view volume left = -, right = bot = -, top = near =, far = 4 3 8/ 3 5/ three.js var camera = new THREE.PerspectiveCamera(fov, aspect, near, far) // which eventually calls: // matrix.makeperspective(left, right, top, bottom, near, far);

22 Perspective View Volume Derivation top plane: repeat for bot plane to get another eqn, then solve for F and B similar process for solving for the other unknowns, using the left/right and near/far planes

23 Perspective Projection -- Example Example tracks in VCS: left x=-, y=- right x=, y=- view volume left = -, right = bot = -, top = near =, far = 4

24 Perspective Projection -- Example Example = / h

25 Projective Rendering Pipeline OCS WCS VCS modeling transformation viewing transformation OCS - object coordinate system WCS - world coordinate system VCS - viewing coordinate system CCS - clipping coordinate system NDCS - normalized device coordinate system DCS - device coordinate system projection transformation / h viewport transformation CCS NDCS DCS

26 Viewport Transformation (,) (w,h) (-,-) NDCS (0,0) DCS x a y b three.js: WebGL: renderer.setviewport(x,y,a,b); gl.viewport(x,y,a,b); gl.viewport(0,0,w,h) is default