Interaction. CSCI 480 Computer Graphics Lecture 3

Similar documents
Interaction Computer Graphics I Lecture 3

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

Order of Transformations

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

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

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

Basic Graphics Programming

OpenGL/GLUT Intro. Week 1, Fri Jan 12

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

CSC 470 Computer Graphics

Using OpenGL with CUDA

Computer Graphics (CS 4731) Lecture 11: Implementing Transformations. Prof Emmanuel Agu. Computer Science Dept. Worcester Polytechnic Institute (WPI)

Basic Graphics Programming

Computer Graphics (CS 4731) Lecture 11: Implementing Transformations. Prof Emmanuel Agu. Computer Science Dept. Worcester Polytechnic Institute (WPI)

Lectures OpenGL Introduction


Programming with OpenGL Part 3: Three Dimensions

Computer Graphics CS 543 Lecture 5 (Part 2) Implementing Transformations

Computer graphics MN1

SOURCES AND URLS BIBLIOGRAPHY AND REFERENCES

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

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

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

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

Lecture 3 Advanced Computer Graphics (CS & SE )

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

Exercise 1 Introduction to OpenGL

Lecture 3. Understanding of OPenGL programming

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

OpenGL refresher. Advanced Computer Graphics 2012

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

Precept 2 Aleksey Boyko February 18, 2011

Computer graphics MN1

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

1/12/11. Basic Graphics Programming. What is OpenGL. OpenGL is cross-platform. How does OpenGL work. How does OpenGL work (continued) The result

Ulf Assarsson Department of Computer Engineering Chalmers University of Technology

Introduction to Computer Graphics with OpenGL/GLUT

Display Lists in OpenGL

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

1.2 Basic Graphics Programming

Ulf Assarsson Department of Computer Engineering Chalmers University of Technology

GL_COLOR_BUFFER_BIT, GL_PROJECTION, GL_MODELVIEW

1 (Practice 1) Introduction to OpenGL

Computer Graphics Course 2005

Lecture 4 of 41. Lab 1a: OpenGL Basics

Class of Algorithms. Visible Surface Determination. Back Face Culling Test. Back Face Culling: Object Space v. Back Face Culling: Object Space.

Transformation Pipeline

Computer Graphics. Bing-Yu Chen National Taiwan University

C OMPUTER G RAPHICS Thursday

Introduction to OpenGL

Intro to OpenGL III. Don Fussell Computer Science Department The University of Texas at Austin

Lectures Display List

Programming using OpenGL: A first Introduction

Graphics Programming

RECITATION - 1. Ceng477 Fall

CS 4204 Computer Graphics

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

Computer Graphics (Basic OpenGL)

Visualizing Molecular Dynamics

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

UNIT 7 LIGHTING AND SHADING. 1. Explain phong lighting model. Indicate the advantages and disadvantages. (Jun2012) 10M

Viewing and Projection

CS D Transformation. Junqiao Zhao 赵君峤

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

Lecture 11: Callbacks. CITS 3003 Graphics & Animation

COMPUTER GRAPHICS LAB # 3

ERKELEY DAVIS IRVINE LOS ANGELES RIVERSIDE SAN DIEGO SAN FRANCISCO EECS 104. Fundamentals of Computer Graphics. OpenGL

Introduction to OpenGL: Part 2

Display Lists. Conceptually similar to a graphics file. In client-server environment, display list is placed on server

Graphics Hardware and OpenGL

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

CS418 OpenGL & GLUT Programming Tutorial (I) Presented by : Wei-Wen Feng 1/30/2008

QUESTION 1 [10] 2 COS340-A October/November 2009

Fundamental Types of Viewing

Computer Graphics Primitive Attributes

Viewing and Projection

Rendering Pipeline/ OpenGL

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

CS 543 Lecture 1 (Part 3) Prof Emmanuel Agu. Computer Science Dept. Worcester Polytechnic Institute (WPI)

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

Lecture 2 CISC440/640 Spring Department of Computer and Information Science

Lecture 5: Viewing. CSE Computer Graphics (Fall 2010)

1) Program to display a set of values {fij} as a rectangular mesh. #include<gl/glut.h> #define maxx 20. #define maxy 20. #define dx 15.

Drawing Primitives. OpenGL basics

Computer Graphics. OpenGL

Transformations. CS 537 Interactive Computer Graphics Prof. David E. Breen Department of Computer Science

CSE 167: Introduction to Computer Graphics Lecture #5: Projection. Jürgen P. Schulze, Ph.D. University of California, San Diego Fall Quarter 2017

OpenGL and X, Column 1: An OpenGL Toolkit

Intro to OpenGL III. Don Fussell Computer Science Department The University of Texas at Austin

Lecture 2 Sections 3.6, 3.7. Fri, Aug 28, 2009

CSE 167: Introduction to Computer Graphics Lecture #5: Rasterization. Jürgen P. Schulze, Ph.D. University of California, San Diego Fall Quarter 2015

Comp 410/510 Computer Graphics Spring Input & Interaction

Graphics Programming. 1. The Sierpinski Gasket. Chapter 2. Introduction:

Input and Interaction

Lecture 4. Interaction / Graphical Devices. CS 354 Computer Graphics Sunday, January 20, 13

Objectives. transformation. General Transformations. Affine Transformations. Notation. Pipeline Implementation. Introduce standard transformations

2 Transformations and Homogeneous Coordinates

GLUT Tutorial. Keyboard

OPENGL TM AND X, COLUMN 1: AN OPENGL TOOLKIT

Transcription:

CSCI 480 Computer Graphics Lecture 3 Interaction January 18, 2012 Jernej Barbic University of Southern California Client/Server Model Callbacks Double Buffering Hidden Surface Removal Simple Transformations [Angel Ch. 3] http://www-bcf.usc.edu/~jbarbic/cs480-s12/ 1

Triangles (Clarification) Can be any shape or size Well-shaped triangles have advantages for numerical simulation Shape quality makes little difference for basic OpenGL rendering 2

Choice of Programming Language OpenGL lives close to the hardware OpenGL is not object-oriented OpenGL is not a functional language (as in, ML) Use C to expose and exploit low-level details Use C++, Java,... for toolkits Support for C in assignments 3

Client/Server Model Graphics hardware and caching Client Server CPU GPU Important for efficiency Need to be aware where data are stored Examples: vertex arrays, display lists 4

The CPU-GPU bus AGP, PCI, PCI Express Fast, but limited bandwidth CPU possible, but very slow GPU 5

Display Lists Cache a sequence of drawing commands Optimize and store on server (GPU) Client CPU bus Server GPU Store geometry, colors, lighting properties of objects on the GPU 6

Display Lists Cache a sequence of drawing commands Optimize and store on server (GPU) GLuint listname = glgenlists(1); /* new list name */ glnewlist (listname, GL_COMPILE); /* new list */ glcolor3f(1.0, 0.0, 1.0); glbegin(gl_triangles); glvertex3f(0.0, 0.0, 0.0);... glend(); glendlist(); /* at this point, OpenGL compiles the list */ glcalllist(listname); /* draw the object */ 7

Display Lists Details Very useful with complex objects that are redrawn often (e.g., with transformations) Another example: fonts (2D or 3D) Display lists can call other display lists Display lists cannot be changed Display lists can be erased / replaced Not necessary in first assignment Display lists are now deprecated in OpenGL For complex usage, use the VertexBufferObject (VBO) extension 8

Vertex Arrays Draw cube with 6*4=24 or with 8 vertices? Expense in drawing and transformation Strips help to some extent Vertex arrays provide general solution Advanced (since OpenGL 1.2) Define (transmit) array of vertices, colors, normals Draw using index into array(s) Vertex sharing for efficient operations Not needed for first assignment 9

Outline Client/Server Model Callbacks Double Buffering Hidden Surface Removal Simple Transformations Example 10

GLUT Program with Callbacks START Initialization Main event loop Idle() Reshape(..) Motion(..) Mouse(..) Display() Keyboard(..) Menu(..) END 11

Main Event Loop Standard technique for interaction (GLUT, Qt, wxwidgets,...) Main loop processes events Dispatch to functions specified by client Callbacks also common in operating systems Poor man s functional programming 12

Types of Callbacks Display ( ) : when window must be drawn Idle ( ) : when no other events to be handled Keyboard (unsigned char key, int x, int y) : key pressed Menu (...) : after selection from menu Mouse (int button, int state, int x, int y) : mouse button Motion (...) : mouse movement Reshape (int w, int h) : window resize Any callback can be NULL 13

Outline Client/Server Model Callbacks Double Buffering Hidden Surface Removal Simple Transformations Example 14

Screen Refresh Common: 60-100 Hz Flicker if drawing overlaps screen refresh Problem during animation Solution: use two separate frame buffers: Draw into one buffer Swap and display, while drawing into other buffer Desirable frame rate >= 30 fps (frames/second) 15

Enabling Single/Double Buffering glutinitdisplaymode(glut_single); glutinitdisplaymode(glut_double); Single buffering: Must call glfinish() at the end of Display() Double buffering: Must call glutswapbuffers() at the end of Display() Must call glutpostredisplay() at the end of Idle() If something in OpenGL has no effect or does not work, check the modes in glutinitdisplaymode 16

Outline Client/Server Model Callbacks Double Buffering Hidden Surface Removal Simple Transformations Example 17

Hidden Surface Removal Classic problem of computer graphics What is visible after clipping and projection? Object-space vs image-space approaches Object space: depth sort (Painter s algorithm) Image space: z-buffer algorithm Related: back-face culling 18

Object-Space Approach Consider objects pairwise Complexity O(k 2 ) where k = # of objects Painter s algorithm: render back-to-front Paint over invisible polygons How to sort and how to test overlap? 19

Depth Sorting First, sort by furthest distance z from viewer If minimum depth of A is greater than maximum depth of B, A can be drawn before B If either x or y extents do not overlap, A and B can be drawn independently 20

Some Difficult Cases Sometimes cannot sort polygons! Cyclic overlap Piercing Polygons One solution: compute intersections & subdivide Do while rasterizing (difficult in object space) 21

Painter s Algorithm Assessment Strengths Simple (most of the time) Handles transparency well Sometimes, no need to sort (e.g., heightfield) Weaknesses Clumsy when geometry is complex Sorting can be expensive Usage PostScript interpreters OpenGL: not supported (must implement Painter s Algorithm manually) 22

Image-Space Approach Raycasting: intersect ray with polygons O(k) worst case (often better) Images can be more jagged (need anti-aliasing) 23

The z-buffer Algorithm z-buffer stores depth values z for each pixel Before writing a pixel into framebuffer: Compute distance z of pixel from viewer If closer, write and update z-buffer, otherwise discard 24

z-buffer Algorithm Assessment Strengths Simple (no sorting or splitting) Independent of geometric primitives Weaknesses Memory intensive (but memory is cheap now) Tricky to handle transparency and blending Depth-ordering artifacts Usage z-buffering comes standard with OpenGL; disabled by default; must be enabled 25

Depth Buffer in OpenGL glutinitdisplaymode(glut_double GLUT_RGBA GLUT_DEPTH); glenable (GL_DEPTH_TEST); Inside Display(): glclear (GL_DEPTH_BUFFER_BIT); Remember all of these! Some tricks use z-buffer in read-only mode 26

Outline Client/Server Model Callbacks Double Buffering Hidden Surface Removal Simple Transformations Example 27

Specifying the Viewing Volume Clip everything not in viewing volume Separate matrices for transformation and projection glmatrixmode (GL_PROJECTION); glloadidentity();... Set viewing volume... glmatrixmode(gl_modelview); 28

Parallel Viewing Orthographic projection Camera points in negative z direction glortho(xmin, xmax, ymin, ymax, near, far) 29

Perspective Viewing Slightly more complex glfrustum(xmin, xmax, ymin, ymax, near, far) 30

Simple Transformations Rotate by given angle (in degrees) about axis given by (x, y, z) glrotate{fd}(angle, x, y, z); Translate by the given x, y, and z values gltranslate{fd}(x, y, z); Scale with a factor in the x, y, and z direction glscale{fd}(x, y, z); 31

Outline Client/Server Model Callbacks Double Buffering Hidden Surface Removal Simple Transformations Example 32

Example: Rotating Color Cube Adapted from [Angel, Ch. 4] Problem: Draw a color cube Rotate it about x, y, or z axis, depending on left, middle or right mouse click Stop when space bar is pressed Quit when q or Q is pressed 33

Step 1: Defining the Vertices Use parallel arrays for vertices and colors /* vertices of cube about the origin */ GLfloat vertices[8][3] = {{-1.0, -1.0, -1.0}, {1.0, -1.0, -1.0}, {1.0, 1.0, -1.0}, {-1.0, 1.0, -1.0}, {-1.0, -1.0, 1.0}, {1.0, -1.0, 1.0}, {1.0, 1.0, 1.0}, {-1.0, 1.0, 1.0}}; /* colors to be assigned to vertices */ GLfloat colors[8][3] = {{0.0, 0.0, 0.0}, {1.0, 0.0, 0.0}, {1.0, 1.0, 0.0}, {0.0, 1.0, 0.0}, {0.0, 0.0, 1.0}, {1.0, 0.0, 1.0}, {1.0, 1.0, 1.0}, {0.0, 1.0, 1.0}}; 34

Step 2: Set Up z-buffer and Double Buffering int main(int argc, char **argv) { } glutinit(&argc, argv); /* double buffering for smooth animation */ glutinitdisplaymode (GLUT_DOUBLE GLUT_DEPTH GLUT_RGB);... /* window creation and callbacks here */ glenable(gl_depth_test); glutmainloop(); return(0); 35

Step 3: Install Callbacks Create window and set callbacks glutinitwindowsize(500, 500); glutcreatewindow("cube"); glutreshapefunc(myreshape); glutdisplayfunc(display); glutidlefunc(spincube); glutmousefunc(mouse); glutkeyboardfunc(keyboard); 36

Step 4: Reshape Callback Set projection and viewport, preserve aspect ratio void myreshape(int w, int h) { GLfloat aspect = (GLfloat) w / (GLfloat) h; glviewport(0, 0, w, h); glmatrixmode(gl_projection); glloadidentity(); if (w <= h) /* aspect <= 1 */ glortho(-2.0, 2.0, -2.0/aspect, 2.0/aspect, -10.0, 10.0); else /* aspect > 1 */ glortho(-2.0*aspect, 2.0*aspect, -2.0, 2.0, -10.0, 10.0); glmatrixmode(gl_modelview); } 37

Step 5: Display Callback Clear, rotate, draw, flush, swap GLfloat theta[3] = {0.0, 0.0, 0.0}; void display(void) { glclear(gl_color_buffer_bit GL_DEPTH_BUFFER_BIT); glloadidentity(); glrotatef(theta[0], 1.0, 0.0, 0.0); glrotatef(theta[1], 0.0, 1.0, 0.0); glrotatef(theta[2], 0.0, 0.0, 1.0); colorcube(); glutswapbuffers(); } 38

Step 6: Drawing Faces Call face(a, b, c, d) with vertex index Orient consistently void colorcube(void) { face(0,3,2,1); face(2,3,7,6); face(0,4,7,3); face(1,2,6,5); face(4,5,6,7); face(0,1,5,4); } 39

Step 7: Drawing a Face Use vector form of primitives and attributes void face(int a, int b, int c, int d) { glbegin(gl_polygon); glcolor3fv(colors[a]); glvertex3fv(vertices[a]); glcolor3fv(colors[b]); glvertex3fv(vertices[b]); glcolor3fv(colors[c]); glvertex3fv(vertices[c]); glcolor3fv(colors[d]); glvertex3fv(vertices[d]); glend(); } 40

Step 8: Animation Set idle callback GLfloat delta = 2.0; GLint axis = 2; void spincube() { /* spin the cube delta degrees about selected axis */ theta[axis] += delta; if (theta[axis] > 360.0) theta[axis] -= 360.0; } /* display result (do not forget this!) */ glutpostredisplay(); 41

Step 9: Change Axis of Rotation Mouse callback void mouse(int btn, int state, int x, int y) { if ((btn==glut_left_button) && (state == GLUT_DOWN)) axis = 0; if ((btn==glut_middle_button) && (state == GLUT_DOWN)) axis = 1; } if ((btn==glut_right_button) && (state == GLUT_DOWN)) axis = 2; 42

Step 10: Toggle Rotation or Exit Keyboard callback void keyboard(unsigned char key, int x, int y) { if (key=='q' key == 'Q') exit(0); if (key==' ') stop =!stop; if (stop) glutidlefunc(null); else glutidlefunc(spincube); } 43

Summary Client/Server Model Callbacks Double Buffering Hidden Surface Removal Simple Transformations Example 44

Announcements Assignment 1 will be posted this week Microsoft Visual Studio (Windows) access enabled via Microsoft s MSDN Please start early Check web page for instructions 45