Loading in 5 sec....

2D Coordinate Systems and DrawingPowerPoint Presentation

2D Coordinate Systems and Drawing

- By
**pilis** - Follow User

- 93 Views
- Uploaded on

Download Presentation
## PowerPoint Slideshow about '2D Coordinate Systems and Drawing' - pilis

**An Image/Link below is provided (as is) to download presentation**

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.

- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -

Presentation Transcript

### 2D Coordinate Systems and Drawing

Coordinate Systems

- Screen coordinate system
- World coordinate system
- World window
- Viewport
- Window to viewport mapping

Screen Coordinate System

- 2D regular Cartesian grid
- Origin (0, 0) at the lower left
(OpenGL convention)

- Pixels are defined at intersections
- Defined relatively to
- the display window

y

Your Monitor Screen

x

(0, 0)

(2, 2)

Screen Coordinate System

- Not easy to use in practice
- Window size can vary

Screen Coordinate System

- Not easy to use in practice
- Window size can vary
- People prefer to specify objects in their actual sizes

Objects should be specified independent of the screen coordinate system.

2D Drawing coordinate system.

World

Objects (in world coordinate system)

World Window

Screen Window

Screen

Define a world window coordinate system.

Define a world window coordinate system.

- A rectangular region in the world that is to be displayed (in world coordinate system)

gluOrtho2D(W_L, W_R, W_B, W_T)

OpenGL function:

2D orthogonal projection

Viewport coordinate system.

- A rectangular region in the screen for display (in screen coordinate system)

glViewport(V_L, V_B, V_R-V_L, V_T-V_B)

An Example coordinate system.

(1, 1)

void DrawQuad()

{

glViewport(50, 50, 300, 200);

glMatrixMode(GL_PROJECTION);

glLoadIdentity();

gluOrtho2D(-1, 1, -1, 1);

glBegin(GL_QUADS);

glVertex2f(-0.5, -0.5);

glVertex2f( 0.5, -0.5);

glVertex2f( 0.5, 0.5);

glVertex2f(-0.5, 0.5);

glEnd();

}

(-0.5, 0.5)

(0.5, 0.5)

(-1, -1)

(400, 300)

(350, 250)

(-0.5, -0.5)

(0.5, -0.5)

(50, 50)

(0, 0)

Remember to… coordinate system.

- Remember to specify the matrix type:

void DrawQuad()

{

glViewport(50, 50, 300, 200);

glMatrixMode(GL_PROJECTION);

glLoadIdentity();

gluOrtho2D(-1, 1, -1, 1);

glBegin(GL_QUADS);

glVertex2f(-0.5, -0.5);

glVertex2f( 0.5, -0.5);

glVertex2f( 0.5, 0.5);

glVertex2f(-0.5, 0.5);

glEnd();

}

How to achieve this mapping? coordinate system.

glViewport(50, 50, 300, 200);

gluOrtho2D(-1, 1, -1, 1);

No need to do mapping by yourself, just call those two functions!

The problem coordinate system.

- Input:
- World window: W_L, W_R, W_B, W_T
- Viewport: V_L, V_R, V_B, V_T
- Some point (x, y) in the world coordinate system

- Output:
- (sx, sy) on the screen

Keep the Same Ratio coordinate system.

sx - V_L

x - W_L

W_R - W_L

V_R - V_L

(x - W_L) / (W_R - W_L) = (sx - V_L) / (V_R - V_L)

sx = (x - W_L)(V_R - V_L) / (W_R - W_L) +V_L

Keep the Same Ratio coordinate system.

V_T – V_B

W_T – W_B

y – W_B

sy – V_B

(y – W_B) / (W_T – W_B) = (sy – V_B) / (V_T – V_B)

sy = (y – W_B)(V_T - V_B) / (W_T - W_B) +V_B

Practical Questions coordinate system.

- How to initialize
- The world window
- The viewport

- How to transform
- Translation
- Zoom in, zoom out…

A simple way to initialize the world window coordinate system.

- Cover everything

Zoom In/Out coordinate system.

- Call gluOrtho2D() with new ranges

Distortion Example coordinate system.

(1, 1)

void DrawQuad()

{

glViewport(50, 50, 300, 200);

glMatrixMode(GL_PROJECTION);

glLoadIdentity();

gluOrtho2D(-1, 1, -1, 1);

glBegin(GL_QUADS);

glVertex2f(-0.5, -0.5);

glVertex2f( 0.5, -0.5);

glVertex2f( 0.5, 0.5);

glVertex2f(-0.5, 0.5);

glEnd();

}

(-0.5, 0.5)

(0.5, 0.5)

(-1, -1)

(400, 300)

(350, 250)

(-0.5, -0.5)

(0.5, -0.5)

(50, 50)

(0, 0)

Distortion happens when aspect ratios are not consistent coordinate system.

(1, 1)

void DrawQuad()

{

glViewport(50, 50, 300, 200);

glMatrixMode(GL_PROJECTION);

glLoadIdentity();

gluOrtho2D(-1, 1, -1, 1);

glBegin(GL_QUADS);

glVertex2f(-0.5, -0.5);

glVertex2f( 0.5, -0.5);

glVertex2f( 0.5, 0.5);

glVertex2f(-0.5, 0.5);

glEnd();

}

(-0.5, 0.5)

(0.5, 0.5)

(-1, -1)

(400, 300)

(350, 250)

(-0.5, -0.5)

(0.5, -0.5)

(50, 50)

(0, 0)

Two solutions coordinate system.

(-0.5, 0.5)

(0.5, 0.5)

(-0.5, 0.5)

(0.5, 0.5)

(-0.5, -0.5)

(0.5, -0.5)

(-0.5, -0.5)

(0.5, -0.5)

Where to define viewport? coordinate system.

- Two places
- Initialization: the same size as the whole window
- Every time the user resizes the window
- Call Viewport in your resize callback function

Example coordinate system.

world_height

(center_x, center_y)

world_width

world_height=world_width*view_port_height/view_port_width

Example coordinate system.

world_height

(center_x, center_y)

world_width

W_L=center_x-world_width/2

W_B=center_y+world_height/2

W_R=center_x+world_width/2

W_T=center_y+world_height/2

Download Presentation

Connecting to Server..