Coordinate Systems and Transforming the Coordinates from one to another Introduction to Computer Graphics David J.Eck Hearn, Baker, Carithers Computer Graphics with Open GL, Huamin Wang Lecture Notes

Transformation sequence from modeling coordinates to device coordinates 1.step:Object shapes can be individually defined in modeling-coordinate reference systems. 2.step: The shapes are positioned within the world-coordinate scene. 3.step:World-coordinate specifications are transformed through the viewing pipeline to viewing and projection coordinates and then to normalized coordinates. 4.step: Viewing coordinates translates to normalized coordinate 5. step: individual device drivers transfer the normalized-coordinate representation of the scene to the output devices for display.

Model Coordinate System (Object Coordinates) 2D Regular Cartesian Grid Origin (0,0) at lower left corner (OpenGL convention) Horizontal axis – x Vertical axis – y Pixels are defined at the grid intersections Model coordinate system is defined relative to the display window origin (OpenGL: the lower left corner of the window) y x (0,0) (2,2)

A character defined as a rectangular grid of pixel positions. A character defined as an outline shape. A character defined as a rectangular grid of pixel positions.

World Coordinate System glBegin(GL_LINE_STRIP); for (x = -4.0; x <4.0; x+=0.1){ Glfloat y = sin(3.14 * x) / (3.14 * x); glVertex2f (x,y); } glEnd(); plot a sinc function: sinc(x) = sin(PI*x)/PI*x x = -4 .. +4 The unnormalized sinc function is defined as sinc(x) = sinx/ x This function is used in signal processing, a field which includes sound recording and radio transmission

Line segments in OpenGL using a list of five endpoint coordinates (a) An unconnected set of lines generated with the primitive line constant GL_LINES. (b) A polyline generated with GL_LINE_STRIP. (c) A closed polyline generated with GL_LINE_LOOP.

400 by 300 display window at position (50, 100) relative to the top-left corner of the video display

Display window and line segment produced by the example program

World Coordinate System Model (Object) coordinate system is not easy to use. Therefore a new coordinate system must be defined Model Coordinate System 10 feet 20 feet

Define a World Window

World Window World window – a rectangular region in the world that is to be displayed Define by W_L, W_R, W_B, W_T W_B W_T W_L W_R OpenGL command: gluOrtho2D(left, right, bottom, top)

Viewport The rectangular region in the screen for displaying the graphical objects defined in the world window Defined in the screen coordinate system V_L V_R V_B V_T glViewport(int left, int bottom, int (right-left),int (top-bottom)); call this function before drawing (glBegin() and glEnd() )

Viewing and Modeling In a typical example, we have a rectangle made of pixels, with its natural pixel coordinates, where an image will be displayed. This rectangle will be called the viewport. We also have a set of geometric objects that are defined in a possibly different coordinate system These objects make up the "scene" or "world" that we want to view, The coordinates that we use to define the scene are called world coordinates.

Viewing and Modeling For 2D graphics, the world lies in a plane. It's not possible to show a picture of the entire infinite plane. We need to pick some rectangular area in the plane to display in the image. We call the rectangular area the window, or view window. A coordinate transform is used to map the window to the viewport

Where the pixels are located in 2D? A raster image is indexed by the pair (i, j) i indicates the column(widht) and j indicates row (height) of the pixel Pixel is counted from the bottom left. If an image has nx columns and ny rows of pixels, the bottom-left pixel is (0, 0) and the top-right is pixel (nx − 1, ny − 1). We need 2D real screen coordinates to specify pixel positions. We will place the pixels’ sample points at integer coordinates, as shown by the 4 × 3 screen i Coordinates of a four pixel × three pixel screen in some APIs the y-axis will point downward

Where the pixels are located in 2D? In some APIs, and many file formats, the rows of an image are organized top-to-bottom, so that (0, 0) is at the top left. the rows in analog television transmission started from the top. The rectangular domain of the image has width nx and height ny and is centered on this grid, it extends half a pixel beyond the last sample point on each side. So the rectangular domain of a nx × ny image is R=[−0.5,nx−0.5]×[−0.5,ny−0.5]. I(x,y):R→V

Viewing and Modeling T represents the coordinate transformation T is a function This function takes world coordinates (x,y) in some window and maps them to pixel coordinates T(x,y) in the viewport. T(x,y) = ( 800*(x+4)/8, 600*(3-y)/6 ) The rectangle with corners is at (-1,2) and (3,-1) in the window. When this rectangle is displayed in the viewport, it is displayed as the rectangle with corners T(-1,2) and T(3,-1). In the example, T(-1,2) = (300,100) and T(3,-1) = (700,400)

The coordinates that we use to define an object are called object coordinates for the object. When we want to place the object into a scene, we need to transform the object coordinates into the world coordinate system that we are using for the scene. The transformation that we need is called a modeling transformation. An object defined in its own object coordinate system and then mapped by three different modeling transformations into the world coordinate system:

In order to view the scene, there will be another transformation that maps the object from a view window in world coordinates into the viewport. The choice of a view window tells which part of the scene is shown in the image. Moving, resizing, or even rotating the window will give a different view of the scene. Suppose we make several images of the same car:

Viewport Transformation When we modify the view window, we change the coordinate system that is applied to the viewport. This is the same as leaving that coordinate system in place and moving the objects in the scene instead. To get the same effect in the final image, you have to apply the opposite transformation to the objects Moving the window to the left is equivalent to moving the objects to the right Finally: There is no essential distinction between transforming the window and transforming the object.

Modeling and Coordinate Transforms We specify a geometric primitive by giving coordinates in some natural coordinate system. The computer applies a sequence of transformations to those coordinates to produce the coordinates that are used to actually draw the primitive in the image. Some of those transformations are modeling transforms and some are as coordinate transforms, It's all the same to the computer

Drawing in world coordinate system in 2D We need two tasks to be done We define a rectangular world window (call an OpenGL function) We define a viewport (call an OpenGL function) Perform window to viewport mapping (OpenGL internals will do this for us)

An OpenGL example DrawQuad() {glViewport(0,0,300,200); glMatrixMode(GL_PROJECTION); glLoadIndentity(); glOrtho2D(-1,1,-1,1); glBegin(GL_QUADS); glColor3f(1,1,0); glVertex2i(-0.5,-0.5); glVertex2i(+0.5,-0.5); glVertex2i(+0.5,+0.5); glVertex2i(-0.5,+0.5); glEnd(); } (300,200) (0,0) viewport

Mapping from World Window to Viewport Coordinates The objects in the world window will be drawn onto the viewport viewport (x,y) World window (Sx, Sy)

Mapping from World Window to Viewport Coordinates How can we calculate (sx, sy) from (x,y) in the screen coordinate system ? (x,y) (Sx, Sy) world window (W_L, W_R, W_B, W_T) viewport (V_L, V_R, V_B, V_T)

Mapping from World Window to Viewport Coordinates gluortho2D(Left, Right, Bottom, Top); Before calling gluOrtho2D(), we need to have the following two lines of code

Mapping from World Window into Viewport Coordinates The mapping should be proportional (x,y) (sx,sy) (x – W_L) / (W_R – W_L) = (sx – V_L) / (V_R – V_L) (y - W_B) / (W_T – W_B) = (sy – V_B) / (V_T – V_B) sx = x * (V_R-V_L)/(W_R-W_L) - W_L * (V_R – V_L)/(W_R-W_L) + V_L sy = y * (V_T-V_B)/(W_T-W_B) – W_B * (V_T-V_B)/(W_T-W_B) + V_B

Some Questions and Answers in OpenGL How to set up an appropriate world window automatically? How to zoom in the picture? How to set up an appropriate viewport, so that the picture is not going to be distorted? OpenGL will do it for ıs We just need to define the viewport with glViewport() and a world window with gluOrtho2D() We can define a world window as follow: we can define viewport as: glMatrixMode(GL_PROJECTION); glViewport(0,0,300,200) glLoadIdentity(); gluOrtho2D(Left, Right, Bottom, Top);

World Window set up The basic idea is to see all the objects in the world This can just be initial view, and the user can change it later min X max X min Y max Y

Zoom into the picture Shrink the world window call gluOrtho2D() with a new range Viewport If world window and display window have different aspect ratios, distortion happens R = W / H aspect ratio

Comparing the aspect ratios W World window Aspect Ratio = R Display window Aspect Ratio = W / H R > W / H

Matching the Aspect Ratios W/R W World window Aspect Ratio = R Display window Aspect Ratio = W / H R > W / H glViewport(0, 0, W, W/R)

Comparing the aspect ratios W World window Aspect Ratio = R Display window Aspect Ratio = W / H R < W / H

Matching the aspect ratios H * R H W World window Aspect Ratio = R Display window Aspect Ratio = W / H R < W / H glViewport(0, 0, H*R, H)

When to call the function glViewport() ? First: At the initialization phase of the OpenGL If the function is not used, it is accepted default same as the window size Second: When the user resizes the display window

Resize (Reshape) window void winReshapeFcn (GLint newWidth, GLint newHeight) { glMatrixMode (GL_PROJECTION); glLoadIdentity ( ); gluOrtho2D (xwcMin, xwcMax, ywcMin, ywcMax); glClear (GL_COLOR_BUFFER_BIT); } void main (int argc, char ** argv) glutInit (&argc, argv); glutInitDisplayMode (GLUT_SINGLE | GLUT_RGB); glutInitWindowPosition (50, 50); glutInitWindowSize (winWidth, winHeight); glutCreateWindow ("Geometric Transformation Sequence"); init ( ); glutDisplayFunc (displayFcn); glutReshapeFunc (winReshapeFcn); glutMainLoop ( ); Whenever the size of display window is changed, the new width and height are passes to its arguments. This callback function is used to change the parameters of viewport, so that original aspect ration of scene is maintained.

GLUT (OpenGL Utility Toolkit) We can use GLUT to interface with different window systems for fast prototyping GLUT is a window independent API Programs written using OpenGL and GLUT can be ported to Xwindows, MS windows, and Macintosh with no effort GLUT Basics Configure OpenGL frame buffer Create a drawing area (window) Register input callback functions Render,Resize, input: keyboard, mouse, etc Enter event processing loop

Callback Functions Most of window-based programs are event-driven We do nothing until an event happens, then execute some pre-defined functions Events are key press, mouse button press and release, window resize, etc. glutKeyboardFunc() : register the callback that will be called when a key is pressed glutMouseFunc() : register the callback that will be called when a mouse button is pressed glutMotionFunc() : register the callback that will be called when the mouse is in motion while a butonis pressed glutIdleFunc(): register the callback that will be called when nothing is going on (no event)