Drawing and Coordinate Systems

Similar documents
Drawing and Coordinate Systems

Windows and Viewports. Windows and Viewports. Windows and Viewports. Windows and Viewports. CSC 706 Computer Graphics

More on Coordinate Systems. Coordinate Systems (3) Coordinate Systems (2) Coordinate Systems (5) Coordinate Systems (4) 9/15/2011

Computer Graphics (4731) Lecture 4: 2D Graphics Systems (Drawing Polylines, tiling, & Aspect Ratio)

Transformation Pipeline

CMSC 425: Lecture 4 More about OpenGL and GLUT Tuesday, Feb 5, 2013

Lectures OpenGL Introduction

Lecture 3. Understanding of OPenGL programming

Duc Nguyen CSE 420 Computer Graphics 10/10/2018 Homework 1

2. OpenGL -I. 2.1 What is OpenGL? Things OpenGL can do: -23-

6. Make use of glviewport() to display two sine curves on the same screen, one on the

3D computer graphics: geometric modeling of objects in the computer and rendering them

Computer Graphics (CS 543) Lecture 2b: 2D Graphics Systems (Drawing Polylines, tiling, & Aspect Ratio)

COMPUTER GRAPHICS LAB # 3

Graphics Programming

CHAPTER 3. More Drawing Tools.

Announcements OpenGL. Computer Graphics. Autumn 2009 CS4815

Announcements OpenGL. Computer Graphics. Spring CS4815

Computer Graphics. Making Pictures. Computer Graphics CSC470 1

CS 4204 Computer Graphics

Drawing Primitives. OpenGL basics

OpenGL Introduction Computer Graphics and Visualization

Today s class. Viewing transformation Menus Mandelbrot set and pixel drawing. Informationsteknologi

Basic Graphics Programming

COS340A Assignment 1 I Pillemer Student# March 25 th 2007 p1/15

Using OpenGL with CUDA

Assignment 1. Simple Graphics program using OpenGL

Introduction to Computer Graphics with OpenGL/GLUT

CS559: Computer Graphics. Lecture 12: OpenGL Transformation Li Zhang Spring 2008

Computer Graphics Course 2005

Computer Graphics (Basic OpenGL)

Teacher Assistant : Tamir Grossinger Reception hours: by - Building 37 / office -102 Assignments: 4 programing using

CS559: Computer Graphics. Lecture 12: OpenGL Li Zhang Spring 2008

Programming with OpenGL Part 2: Complete Programs Computer Graphics I, Fall

BOUNCING BALL IMRAN IHSAN ASSISTANT PROFESSOR

Graphics Programming. August 31, Programming of the Sierpinski gasket. Programming with OpenGL and C/C++

GL_COLOR_BUFFER_BIT, GL_PROJECTION, GL_MODELVIEW

C++ is Fun Part 13 at Turbine/Warner Bros.! Russell Hanson

521493S Computer Graphics Exercise 1 (Chapters 1-3)

Computer Graphics. Chapter 10 Three-Dimensional Viewing

Getting Started. Overview (1): Getting Started (1): Getting Started (2): Getting Started (3): COSC 4431/5331 Computer Graphics.

// double buffering and RGB glutinitdisplaymode(glut_double GLUT_RGBA); // your own initializations

by modifying the glutinitwindowsize() function you can change the screen size to whatever you please.

Exercise 1 Introduction to OpenGL

Working with Callbacks

Programming with OpenGL Part 3: Three Dimensions

1.2 Basic Graphics Programming

Hierarchical Modeling: Tree of Transformations, Display Lists and Functions, Matrix and Attribute Stacks,

Graphics and Visualization

Precept 2 Aleksey Boyko February 18, 2011

Display Lists in OpenGL

Basic Graphics Programming

Programming using OpenGL: A first Introduction

CSCI 4620/8626. The 2D Viewing Pipeline

Input and Interaction. 1. Interaction. Chapter 3. Introduction: - We now turn to the development of interactive graphics programs.

Bob s Concise Introduction to Doxygen

Computer Graphics. OpenGL

Interaction. CSCI 480 Computer Graphics Lecture 3

Computer Graphics (CS 4731) & 2D Graphics Systems

11/1/13. Basic Graphics Programming. Teaching Assistant. What is OpenGL. Course Producer. Where is OpenGL used. Graphics library (API)

Cameras (and eye) Ideal Pinhole. Real Pinhole. Real + lens. Depth of field

Lecture 4 of 41. Lab 1a: OpenGL Basics


RECITATION - 1. Ceng477 Fall

Abel J. P. Gomes LAB. 1. INTRODUCTION TO OpenGL

Project Sketchpad. Ivan Sutherland (MIT 1963) established the basic interactive paradigm that characterizes interactive computer graphics:

Introduction to OpenGL: Part 2

GRAFIKA KOMPUTER. ~ M. Ali Fauzi

CSC 470 Computer Graphics

To Do. Computer Graphics (Fall 2008) Course Outline. Course Outline. Methodology for Lecture. Demo: Surreal (HW 3)

CS380: Computer Graphics Basic OpenGL Structure. Sung-Eui Yoon ( 윤성의 ) Course URL:

Assignment #6 2D Vector Field Visualization Arrow Plot and LIC

Ulf Assarsson Department of Computer Engineering Chalmers University of Technology

C OMPUTER G RAPHICS Thursday

UNIVERSITY OF NEBRASKA AT OMAHA Computer Science 4620/8626 Computer Graphics Spring 2014 Homework Set 1 Suggested Answers

Interaction Computer Graphics I Lecture 3

Exercise Max. Points Total 90

Computer Graphics Anatomy of GUI. Computer Graphics CSC470 1

Input and Interaction

FAKULTI TEKNOLOGI MAKLUMAT DAN KOMUNIKASI BITM INTERACTIVE COMPUTER GRAPHICS LAB SESSION 4. C++ - OpenGL

Books, OpenGL, GLUT, GLUI, CUDA, OpenCL, OpenCV, PointClouds, and G3D

OpenGL and Qt Creator: a Gentle Introduction

Lecture 3 Advanced Computer Graphics (CS & SE )

Draw the basic Geometry Objects. Hanyang University

Computer Graphics 7: Viewing in 3-D

CS 4204 Computer Graphics

Luiz Fernando Martha André Pereira

2/3/16. Interaction. Triangles (Clarification) Choice of Programming Language. Buffer Objects. The CPU-GPU bus. CSCI 420 Computer Graphics Lecture 3

Interaction. CSCI 420 Computer Graphics Lecture 3

Modeling Transform. Chapter 4 Geometric Transformations. Overview. Instancing. Specify transformation for objects 李同益

Notes on Assignment. Notes on Assignment. Notes on Assignment. Notes on Assignment

Books, OpenGL, GLUT, CUDA, OpenCL, OpenCV, PointClouds, G3D, and Qt

20 GLuint objects; 36 Scale += 0.1; 37 break; 38 case GLUT_KEY_DOWN:

1 (Practice 1) Introduction to OpenGL

Fundamental Types of Viewing

Reading on the Accumulation Buffer: Motion Blur, Anti-Aliasing, and Depth of Field

SOURCES AND URLS BIBLIOGRAPHY AND REFERENCES

Erik Anchondo cse 520 lab 4

Lecture 4. Viewing, Projection and Viewport Transformations

2a. The triangles scale increases (expands) when the 'e' key is pressed and decreases (contracts) when the 'c' key is pressed.

Transcription:

Drawing and Coordinate Systems

Coordinate Systems Screen Coordinate system World Coordinate system World window Viewport Window to viewport mapping

Screen Coordinate System Glut OpenGL (0,0)

Screen Coordinate System - 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 - This coordinate system is defined (0,0) relative to the display window origin (OpenGL: the lower left corner of the window) (2,2) y x

World Coordinate System Screen coordinate system is not easy to use 10 feet 20 feet

World Coordinate System Another example: plot a sinc function: sinc(x) = sin(pi*x)/pi*x x = -4.. +4

World Coordinate System It would be nice if we can use application specific coordinates 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();

OpenGL 2D Drawing You can use your own unit/range to define the positions of your objects Specify a world window (in world coordinate system) to define what you want to display Specify a viewport (in screen coordinate system) to indicate where in the window you want to draw the objects OpenGL will do the mapping and drawing for you

Define a world window

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

Viewport The rectangular area in the screen used to display the objects contained in the world window Defined in the screen coordinate system V_T glviewport(int left, int bottom, int (right-left), int (top-bottom)); V_B V_L V_R always call this function before drawing

A simple example DrawQuad() { (300,200) glviewport(0,0,300,200); glmatrixmode(gl_projection); glloadidentity(); gluortho2d(-1,1,-1,1); glbegin(gl_quads); glcolor3f(1,1,0); glvertex2f(-0.5,-0.5); (0,0) glvertex2f(+0.5,-0.5); viewport glvertex2f(+0.5,+0.5); glvertex2f(-0.5,+0.5); How big is the quad? glend(); }

Window to viewport mapping The objects in the world window will then be drawn onto the viewport (x,y) World window viewport (Sx, Sy)

Window to viewport mapping How to calculate (sx, sy) from (x,y)? (x,y) (Sx, Sy)

Window to viewport mapping Remember you don t need to do it by yourself. OpenGL will do it for you You just need to specify the viewport (with glviewport()), and the world window (with gluortho2d()) But let me explain to you how it is done

Also, one thing to remember A practical OpenGL usage: Before calling gluortho2d(), you need to have the following two lines of code glmatrixmode(gl_projection); glloadidentity(); gluortho2d(left, Right, Bottom, Top);

Window to viewport mapping Things that are given: The world window (W_L, W_R, W_B, W_T) The viewport (V_L, V_R, V_B, V_T) A point (x,y) in the world coordinate system Calculate the corresponding point (sx, sy) in the screen coordinate system

Window to viewport mapping Basic principle: 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)

Window to viewport mapping (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 practical issues 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?

World window setup A general approach is to display all the objects in the world This can be your initial view, and the user can change it later How to achieve it?

World window set up Find the world coordinates extent that will cover the entire scene max Y min Y min X max X

Zoom into the picture Shrink your world window call gluortho2d() with a new range Viewport

Non-distorted viewport setup Distortion happens when World window and display window have different aspect ratios Aspect ratio? R = W / H

Compare aspect ratios H World window Aspect Ratio = R Viewport Aspect Ratio = W / H W R > W / H

Match aspect ratios H R? World window Aspect Ratio = R W Shrink the viewport height so that R > W / H W/new H = R

Match aspect ratios H R W/R World window Aspect Ratio = R R > W / H W Viewport Aspect Ratio = W / W/R = R glviewport(0, 0, W, W/R)

Compare aspect ratios H World window Aspect Ratio = R Viewport Aspect Ratio = W / H W R < W / H

Match aspect ratios? H World window Aspect Ratio = R W Shrink the viewport width so that R < W / H Aspect Ratio = new W / H

Match aspect ratios H * R H World window Aspect Ratio = R Viewport W Aspect Ratio = H*R / H = R R < W / H glviewport(0, 0, H*R, H)

When to call glviewport()? Two places: Initialization Default size: same as the window size Every time when the user resizes the display window (but GLUT will do that for you)

Resize (Reshape) window Void main(int argc, char** argv) { glutdisplayfunc(display); glutreshapefunc(resize); glutkeyboardfunc(key); } void resize () a function provided by you. It will be called when the window changes size.

Resize (reshape) window Void resize(int W, int H) { glviewport(0,0,w, H); } This is done by default in GLUT You can use the call to make sure the aspect ratio is adjusted as we just discussed.

Put it all together DrawQuad() { (300,200) glviewport(0,0,300,200); glmatrixmode(gl_projection); glloadidentity(); gluortho2d(-1,1,-1,1); glbegin(gl_quads); glcolor3f(1,1,0); glvertex2f(-0.5,-0.5); (0,0) glvertex2f(+0.5,-0.5); viewport glvertex2f(+0.5,+0.5); glvertex2f(-0.5,+0.5); How big is the quad? glend(); }

Well, this works too DrawQuad() { glbegin(gl_quads); glcolor3f(1,1,0); glvertex2f(-0.5,-0.5); glvertex2f(+0.5,0); glvertex2f(+0.5,+0.5); glvertex2f(-0.5,+0.5); glend(); } OpenGL Default: glviewport: as large as your display window gluortho2d: gluortho2d(-1,1,-1,1); Why?