Input and Interaction

Size: px
Start display at page:

Download "Input and Interaction"

Transcription

1 Input and Interaction Interactive program is something make CG look interesting Suriyong L., Computer Multimedia 1

2 Physical Input Devices 2 Types Pointing devices Locate or indicate position on screen Almost incorporate with 1 or more buttons Ex. Mouse, track ball: using pairs of encoders for measure motion or distance Keyboard devices Character generator Can be generalized to include any devices that return characters code to program Suriyong L., Computer Multimedia 2

3 Mouse and Track ball Mechanical and optical Mechanical measure motion Optical measure distance by counting lines Track ball The upside down mouse Mouse Trackball Suriyong L., Computer Multimedia 3

4 Mouse Output 2 screen axis is detected independently as position or velocity Converted either in graphics system or hardware For 2D able to position directly on the display if WCS and RCS are the same but rarely use The output type Position: almost relative value, absolute value is rarely used Velocity: small deviation, small change, large deviation, large change Relative positioning, used by measure moving of the mouse Cursor Positioning Suriyong L., Computer Multimedia 4

5 Track point Pressure sensitive devices to control the encoder Align between 2 key and in the middle of the keyboard Suriyong L., Computer Multimedia 5

6 Data Tablet The Absolute position device Tracing the diagram, follow the curve on the screen Wires in rows and columns embedded under the surface and use the electromagnetic interaction Touch sensitive: transparent screen Placed over the CRT Suriyong L., Computer Multimedia 6

7 Light pen Used in Sutherland s original Sketchpad Photocell is a sensitive device The bright light spot of the screen enter the photocell make signal Weak signal in the dark area Suriyong L., Computer Multimedia 7

8 Joystick Measured with 2 orthogonal encoders Integration measure and convert to position Compose with spring and damper, good mechanical feeling Well suited for flight simulator and game Suriyong L., Computer Multimedia 8

9 Spaceball For 3D graphics Joystick like but the stick doesn t move Measure 3 direction forces Up-down, left-right, and front-back Measure 3 independent twist also Has 6 degrees of freedom Suriyong L., Computer Multimedia 9

10 IBM spaceball Suriyong L., Computer Multimedia 10

11 Spaceball Suriyong L., Computer Multimedia 11

12 Other physical devices Laser-based structured-lighting systems Laser-ranging systems Data gloves Etc. Suriyong L., Computer Multimedia 12

13 Logical devices Use logical point of view The return of measurements to the program the time when the device return value PHIGS and GKS consider the devices into 6 classes (6 types of input) Suriyong L., Computer Multimedia 13

14 6 classes of logical device 1. String: Provide ASCII, physical is keyboard 2. Locator: Position of WCS, by pointing devices 3. Pick: Identified an object, usually same device with locator but separate software interface 4. Choice: Select one of a discrete number 5. Dial (or valuators): Analog input 6. Stroke: Array of location, mouse down-data in, mouse up- data stop Suriyong L., Computer Multimedia 14

15 OpenGL compatibility String keyboard Locator mouse Pick use selection process Choice use graphical widgets Provided by windows or a toolkit Typical widget: menu, scrollbar, graphical button Dial - widget Stroke - mouse button-up, button-down Suriyong L., Computer Multimedia 15

16 Measure and Trigger Measure: what the device returns to the user Trigger: what signal the device to signal the computer Ex: keyboard: measure string, trigger when press enter or return Mouse: measure screen position, trigger when press button Measure be able to include other information ex. Status Pick device measures the identifier of the object If only measure, we face the problems to take care the situation correctly. The easy way, include status variable when measure to protect the device out of scope Suriyong L., Computer Multimedia 16

17 Input Mode Depend on the relationship of measure and trigger Request mode: Collect measure, waiting for trigger ex. scanf Sample mode: Measured data return immediately, no trigger required If a lot of devices these mode may have problem Ex. Flight simulator, joystick, dial, buttons and switches, we do not know which one the pilot will use Suriyong L., Computer Multimedia 17

18 Event-mode Each time device is triggered, an event is generated The measure is placed on the event queue Preferable mode for use in API 3 step that we will describe this mode Show event mode as measure-trigger model As a preferred interaction mode to client and server model Show the interface to OpenGL using GLUT Suriyong L., Computer Multimedia 18

19 Request mode Sample mode Event-mode model Suriyong L., Computer Multimedia 19

20 Client-server Former graphics system Big box which has a limit connection to the outside world Present point of view Networks and multi-user used in single-use isolated system Box are called server :perform task for client Work station can be both client and server Graphic server : a work station that can provide I/O service OpenGL program : clients that use the graphics server, we can run program on other graphics server on the network Suriyong L., Computer Multimedia 20

21 Network Suriyong L., Computer Multimedia 21

22 Display Lists How clients and servers improve interactive graphics performance Former use general purpose: slow and expensive, few applications Display CPU: display processor solve the problem, host free after sent message Today use display hardware: Host as client, DPU as server Simple graphics architecture Suriyong L., Computer Multimedia Display-processor architecture 22

23 Mode of display for client-server model Immediate mode No retain memory in the system If screen is cleared or move to new position, primitive must be redefine and be sent High data pass for complex object Retained mode Object are defined once and store in the display list Simple function call to redisplay from client Configuration: Server: special purpose graphic computer Client: good in numerical processing Disadvantage Require more memory on the server: overhead Suriyong L., Computer Multimedia 23

24 Definition and execution with OpenGL Mechanism to define (create) and manipulate (place information in) for display list Definition: Defined in glnewlist/glendlist statement Example define a red box in display list #define BOX 1 /* or some other unused integer */ glnewlist(box, GL_COMPILE); glbegin(gl_polygon); glcolor3f(1.0, 0.0, 0.0); glvertex2f(-1.0, -1.0); glvertex2f( 1.0, -1.0); glvertex2f( 1.0, 1.0); glvertex2f(-1.0, 1.0); glend(); glendlist(); Flag: GL_COMPILE: send to server but not display GL_COMPILE_AND_EXECUTE: with execute Suriyong L., Computer Multimedia 24

25 Function call for display list glcalllist(); : function for calling the list Ex. glcalllist(box); // draw a box on the server Suriyong L., Computer Multimedia 25

26 Text and display list Raster text: Sending bit pattern for each character (which are equal in size) Stroke text: Store the drawing font definition in ROM and called by ASCII Stroke character (a) Filled strings (b) Magnified outlines Suriyong L., Computer Multimedia 26

27 void OurFont(char c) { switch(c) { case a : break; case A ; break; } } Drawing of the letter O Case O gltranslatef(0.5, 0.5, 0.0); glbegin(gl_quad_strip); /* move to center*/ for (i=0; i<=12; i++) { /* 12 vertices */ angle = /6.0*i; /* 30 degrees in radians */ glvertex2f(0.4*cos(angle), 0.4*sin(angle)); glvertex2f(0.5*cos(angle), 0.5*sin(angle)); } glend(); gltranslatef(0.5, -0.5, 0.0); /* move to lower right */ break; Suriyong L., Computer Multimedia 27

28 Code for 256-character set by using OurFont base = glgenlists(256); /* return index of first of 256 consecutive available ids */ for(i=0; i<256; i++) { glnewlist(base + I, GL_COMPILE); OurFont(i); glendlist(); } Function call for display character string char *text_string; glcalllists((glint) strlen(text_string), GL_BYTE, text_string); Suriyong L., Computer Multimedia 28

29 Font in GLUT Access by glutstrokecharacter() glutstrokecharacter(glut_stroke_mono_roman, int character); Raster font glutbitmapcharacter(glut_bitmap_8_by_13, int character); Suriyong L., Computer Multimedia 29

30 Event-driven input programming glutmainloop(); /* an event loop function */ Pointing device Move event Active move: mouse move, button depressed Passive move: mouse move, button released Mouse event Mouse held in position, button either depressed or released, information return GLUT Function glutmousefunc(mouse); /* call back in function main */ mouse function void mouse(int button, int state, int x, int y) { if(button==glut_left_button && state == GLUT_DOWN) exit(); } Suriyong L., Computer Multimedia 30

31 int main(int argc, char **argv) { glutinit(&argc, argv) glutinitdisplaymode(glut_single GLUT_RGB); glutcreatewindow( square ); myinit(); glutreshapefunc(myreshape); glutmousefunc(mouse); glutdisplayfunc(display); glutmainloop(); } Suriyong L., Computer Multimedia 31

32 glutevent Window events when Redraw, resize Aspect ratio Attribute of new primitive Use glutreshapefunc(reshape_function); Suriyong L., Computer Multimedia 32

33 Keyboard Events When key pressed Use glutkeyboardfunc(keyboad_function); void keyboard_function(unsigned char key, int x, int y) { if(key == q key == Q ) exit(); } Suriyong L., Computer Multimedia 33

34 menu Glut provide pop-up menu, can use with mouse use: glutcreatemenu(); // create menu glutaddentrymenu(); // add the menu entry Menu which has sub menu Suriyong L., Computer Multimedia 34

35 Double buffer mode display Former graphic the use single buffer Redraw directly on graphic Flicker may happen especially the animation User need to refresh the display at the display rate (50-70Hz) The double buffer can resolve One for display (front buffer) One for redraw (back buffer) Both is swappable for smooth graphic Using glutswapbuffers() at display function Initial display mode set use GLUT_DOUBLE mode set at glutinitdisplaymode(); (see at rotate square double buffers.exe) Suriyong L., Computer Multimedia 35

36 Picking Allow the user to identify an object on the display For modern system, picking is more difficult Nature of their rendering pipeline The pipeline hardware process is not reversible Suriyong L., Computer Multimedia 36

37 Dealing with Picking (selection process) Selection Use clipping and view port which near the cursor to get the hit list Compare the hit list by user program Bounding rectangle ( window defining) use smallest rectangle object that aligned with the axe is detected Using back buffer draw the objects into the back buffer with the pick colors. get mouse position using the mouse callback. Find the color at frame position use glreadpixels() Find the object which corresponds to the read color Suriyong L., Computer Multimedia 37

38 Four steps that are initiated by a pick function in the application. draw objects into the back buffer with pick colors. get position of mouse using mouse callback. use glreadpixels() to find the color at the position correspond to mouse position in the frame buffer. search a table of colors to find which object corresponds to the color read. Suriyong L., Computer Multimedia 38

39 (a) (b) Normal window and display Window and display after applying pick matrix Suriyong L., Computer Multimedia 39

40 Logics operation There are several modes to draw pixel in frame buffer 16 possible function to writing bits but interested in 2 replacing mode XOR mode d =d.xor.s if we draw twice, it return to original mode d =(d.xor.s).xor.s mode of draw activate by glenable(gl_color_logic_op); gllogicop(gl_xor); writing to buffer model Suriyong L., Computer Multimedia 40

41 The XOR of color When use xor mode for drawing an image The color is xor bit by bit. suppose: glclearcolor(1,1,1); glcolor(0, 0, 1); glcolor(1, 1, 0); glcolor(0, 0, 1); // screen is white // draw the blue // the result is yellow // draw blue again result is white we use this mode to draw with undisturbed the system eg. cursor in CAD pass the object Suriyong L., Computer Multimedia 41

42 Example practice Drawing erasing a lines Animating an object Creating menu Suriyong L., Computer Multimedia 42

43 Drawing and erasable lines use xor mode to draw a line switch to normal mode // when first mouse press get first point xm = x/500.; ym = (500-y)/500.; // the second mouse press get second point // when release xmm = x/500.; ymm = (500-y)/500.; gllogicop(gl_xor); glbegin(gl_lines); glvertex2f(xm, ym); glvertex2f(xmm, ymm); glend(); gllogicop(gl_copy); glflush(); Suriyong L., Computer Multimedia 43

44 for next line erase, the old with xor and draw with normal mode gllogicop(gl_xor); glbegin(gl_lines); glvertex2f(xm, ym); glvertex2f(xmm, ymm); glend(); glflush(); xmm = x/500.0; ymm = (500-y)/500.0; glbegin(gl_lines); glvertex2f(xm, ym); glvertex2f(xmm, ymm); gllogicop(gl_copy); glend(); glflush(); Suriyong L., Computer Multimedia 44

45 Homework 3.2 Rewrite the Sierpinski-gasket program from Chapter 2 such that the left mouse button will start the generation of points on the screen, the right mouse button will halt the generation of new points, and the middle mouse button will terminate the program. Include a reshape callback Suriyong L., Computer Multimedia 45

46 3.19 Suppose that a CRT has a square face of centimeters and is refreshed in a noninterlaced manner at a rate of 60 Hz. Ten percent of the time that the system takes to draw each scan line is used to return the CRT beam from the right edge to the left edge of the screen (the horizontal-retrace time), and 10 percent of the total drawing time is allocated for the beam to return from the lower-right corner of the screen to the upper-left corner after each refresh is complete (the vertical-retrace time). Assume that the resolution of the display is pixels. Find a relationship between the time at which a lightpen detects the beam and the lightpen s position. Give the result using both centimeters and screen coordinates for the location on the screen Circuit-layout programs are variants of paint programs. Consider the design of logical circuits using the Boolean AND, OR, and NOT functions. Each of these functions is provided by one of the three types of integrated circuits (gates), the symbols for which are shown in Figure Write a program that allows the user to design a logical circuit by selecting gates from a menu and positioning them on the screen. Consider methods for connecting the outputs of one gate to the inputs of others. Figure 3.29 Suriyong L., Computer Multimedia 46

47 Homework 3.18 Consider a table with a two-dimensional sensing device located at the end of two linked arms, as shown in Figure Suppose that the lengths of the two arms are fixed, and the arms are connected by simple (1-degree- of-freedom) pivot joints. Determine the relationship between the joint angles θ and φ and the position of the sensor. l l 2 1 φ θ Figure 3.28 Two-dimensional sensing arm. Suriyong L., Computer Multimedia 47

48 Index Suriyong L., Computer Multimedia 48

Input and Interaction. Input and Interaction

Input and Interaction. Input and Interaction Input and Interaction Input and Interaction CHAPTER 3 We now turn to the development of interactive graphics programs. Interactive computer graphics opens up a myriad of applications, ranging from interactive

More information

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

Input and Interaction. 1. Interaction. Chapter 3. Introduction: - We now turn to the development of interactive graphics programs. Input and Interaction Chapter 3 Introduction: - We now turn to the development of interactive graphics programs. - Our discussion has three main parts First, we consider the variety of devices available

More information

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

Lecture 4. Interaction / Graphical Devices. CS 354 Computer Graphics  Sunday, January 20, 13 Lecture 4 Interaction / Graphical Devices Graphical Input Devices can be described either by - Physical properties Mouse Keyboard Trackball - Logical Properties What is returned to program via API A position

More information

Lecture 10: Input, Interaction & callbacks. CITS 3003 Graphics & Animation

Lecture 10: Input, Interaction & callbacks. CITS 3003 Graphics & Animation Lecture 10: Input, Interaction & callbacks CITS 3003 Graphics & Animation Slides: E. Angel and D. Shreiner: Interactive Computer Graphics 6E Addison-Wesley 2012 Objectives Introduce the basic input devices

More information

Drawing Primitives. OpenGL basics

Drawing Primitives. OpenGL basics CSC 706 Computer Graphics / Dr. N. Gueorguieva 1 OpenGL Libraries Drawing Primitives OpenGL basics OpenGL core library OpenGL32 on Windows GL on most unix/linux systems (libgl.a) OpenGL Utility Library

More information

COMPUTER GRAPHICS LAB # 3

COMPUTER GRAPHICS LAB # 3 COMPUTER GRAPHICS LAB # 3 Chapter 2: COMPUTER GRAPHICS by F.S HILLs. Initial steps in drawing figures (polygon, rectangle etc) Objective: Basic understanding of simple code in OpenGL and initial steps

More information

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

Hierarchical Modeling: Tree of Transformations, Display Lists and Functions, Matrix and Attribute Stacks, Hierarchical Modeling: Tree of Transformations, Display Lists and Functions, Matrix and Attribute Stacks, Hierarchical Modeling Hofstra University 1 Modeling complex objects/motion Decompose object hierarchically

More information

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

Project Sketchpad. Ivan Sutherland (MIT 1963) established the basic interactive paradigm that characterizes interactive computer graphics: Project Sketchpad Ivan Sutherland (MIT 1963) established the basic interactive paradigm that characterizes interactive computer graphics: User sees an object on the display User points to (picks) the object

More information

Announcements OpenGL. Computer Graphics. Autumn 2009 CS4815

Announcements OpenGL. Computer Graphics. Autumn 2009 CS4815 Computer Graphics Autumn 2009 Outline 1 Labs 2 Labs Outline 1 Labs 2 Labs Labs Week02 lab Marking 8 10 labs in total each lab worth 2 3% of overall grade marked on attendance and completion of lab completed

More information

OpenGL/GLUT Intro. Week 1, Fri Jan 12

OpenGL/GLUT Intro. Week 1, Fri Jan 12 University of British Columbia CPSC 314 Computer Graphics Jan-Apr 2007 Tamara Munzner OpenGL/GLUT Intro Week 1, Fri Jan 12 http://www.ugrad.cs.ubc.ca/~cs314/vjan2007 News Labs start next week Reminder:

More information

Announcements OpenGL. Computer Graphics. Spring CS4815

Announcements OpenGL. Computer Graphics. Spring CS4815 Computer Graphics Spring 2017-2018 Outline 1 2 Tutes and Labs Tute02, vector review (see matrix) Week02 lab Lab Marking 10 labs in total each lab worth 3% of overall grade marked on attendance and completion

More information

Better Interactive Programs. Ed Angel Professor of Computer Science, Electrical and Computer Engineering, and Media Arts University of New Mexico

Better Interactive Programs. Ed Angel Professor of Computer Science, Electrical and Computer Engineering, and Media Arts University of New Mexico Better Interactive Programs Ed Angel Professor of Computer Science, Electrical and Computer Engineering, and Media Arts University of New Mexico 1 Objectives Learn to build more sophisticated interactive

More information

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

CS559: Computer Graphics. Lecture 12: OpenGL Li Zhang Spring 2008 CS559: Computer Graphics Lecture 12: OpenGL Li Zhang Spring 2008 Reading Redbook Ch 1 & 2 So far: 3D Geometry Pipeline Model Space (Object Space) Rotation Translation Resizing World Space M Rotation Translation

More information

Better Interactive Programs

Better Interactive Programs Better Interactive Programs Objectives Learn to build more sophisticated interactive programs using Picking Select objects from the display Rubberbanding Interactive drawing of lines and rectangles Display

More information

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

To Do. Computer Graphics (Fall 2008) Course Outline. Course Outline. Methodology for Lecture. Demo: Surreal (HW 3) Computer Graphics (Fall 2008) COMS 4160, Lecture 9: OpenGL 1 http://www.cs.columbia.edu/~cs4160 To Do Start thinking (now) about HW 3. Milestones are due soon. Course Course 3D Graphics Pipeline 3D Graphics

More information

Interaction. CSCI 480 Computer Graphics Lecture 3

Interaction. CSCI 480 Computer Graphics Lecture 3 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

More information

Interaction Computer Graphics I Lecture 3

Interaction Computer Graphics I Lecture 3 15-462 Computer Graphics I Lecture 3 Interaction Client/Server Model Callbacks Double Buffering Hidden Surface Removal Simple Transformations January 21, 2003 [Angel Ch. 3] Frank Pfenning Carnegie Mellon

More information

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

Abel J. P. Gomes LAB. 1. INTRODUCTION TO OpenGL Visual Computing and Multimedia Abel J. P. Gomes 1. Getting Started 2. Installing Graphics Libraries: OpenGL and GLUT 3. Setting up an IDE to run graphics programs in OpenGL/GLUT 4. A First OpenGL/GLUT

More information

Introduction to OpenGL: Part 2

Introduction to OpenGL: Part 2 Introduction to OpenGL: Part 2 Introduction to OpenGL: Part 2 A more complex example recursive refinement Introduction to OpenGL: Part 2 A more complex example recursive refinement Can OpenGL draw continuous

More information

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

Lecture 2 CISC440/640 Spring Department of Computer and Information Science Lecture 2 CISC440/640 Spring 2015 Department of Computer and Information Science Today s Topic The secrets of Glut-tony 2 So let s do some graphics! For the next week or so this is your world: -1 1-1 1

More information

Comp 410/510 Computer Graphics Spring Input & Interaction

Comp 410/510 Computer Graphics Spring Input & Interaction Comp 410/510 Computer Graphics Spring 2018 Input & Interaction Objectives Introduce the basic input devices - Physical Devices - Logical Devices Event-driven input Input Modes Programming event input with

More information

Graphics Programming

Graphics Programming Graphics Programming 3 rd Week, 2011 OpenGL API (1) API (application programming interface) Interface between an application program and a graphics system Application Program OpenGL API Graphics Library

More information

Introduction to Computer Graphics with OpenGL/GLUT

Introduction to Computer Graphics with OpenGL/GLUT Introduction to Computer Graphics with OpenGL/GLUT What is OpenGL? A software interface to graphics hardware Graphics rendering API (Low Level) High-quality color images composed of geometric and image

More information

CS 4731 Lecture 3: Introduction to OpenGL and GLUT: Part II. Emmanuel Agu

CS 4731 Lecture 3: Introduction to OpenGL and GLUT: Part II. Emmanuel Agu CS 4731 Lecture 3: Introduction to OpenGL and GLUT: Part II Emmanuel Agu Recall: OpenGL Skeleton void main(int argc, char** argv){ // First initialize toolkit, set display mode and create window glutinit(&argc,

More information

Computer Graphics Lecture 2

Computer Graphics Lecture 2 1 / 16 Computer Graphics Lecture 2 Dr. Marc Eduard Frîncu West University of Timisoara Feb 28th 2012 2 / 16 Outline 1 Graphics System Graphics Devices Frame Buffer 2 Rendering pipeline 3 Logical Devices

More information

Lecture 3. Understanding of OPenGL programming

Lecture 3. Understanding of OPenGL programming Lecture 3 Understanding of OPenGL programming What is OpenGL GL: stands for Graphic Library Software interface for rendering purposes for 2D or 3D geometric data objects. Various Pieces gl: The basic libraries.

More information

Computer Graphics. Bing-Yu Chen National Taiwan University

Computer Graphics. Bing-Yu Chen National Taiwan University Computer Graphics Bing-Yu Chen National Taiwan University Introduction to OpenGL General OpenGL Introduction An Example OpenGL Program Drawing with OpenGL Transformations Animation and Depth Buffering

More information

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

// double buffering and RGB glutinitdisplaymode(glut_double GLUT_RGBA); // your own initializations #include int main(int argc, char** argv) { glutinit(&argc, argv); Typical OpenGL/GLUT Main Program // GLUT, GLU, and OpenGL defs // program arguments // initialize glut and gl // double buffering

More information

Computer Graphics and Visualization. Graphics Systems and Models

Computer Graphics and Visualization. Graphics Systems and Models UNIT -1 Graphics Systems and Models 1.1 Applications of computer graphics: Display Of Information Design Simulation & Animation User Interfaces 1.2 Graphics systems A Graphics system has 5 main elements:

More information

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

C++ is Fun Part 13 at Turbine/Warner Bros.! Russell Hanson C++ is Fun Part 13 at Turbine/Warner Bros.! Russell Hanson Syllabus 1) First program and introduction to data types and control structures with applications for games learning how to use the programming

More information

Computer Graphics. Making Pictures. Computer Graphics CSC470 1

Computer Graphics. Making Pictures. Computer Graphics CSC470 1 Computer Graphics Making Pictures Computer Graphics CSC470 1 Getting Started Making Pictures Graphics display: Entire screen (a); windows system (b); [both have usual screen coordinates, with y-axis y

More information

Input and Interaction. Ed Angel Professor of Computer Science, Electrical and Computer Engineering, and Media Arts University of New Mexico

Input and Interaction. Ed Angel Professor of Computer Science, Electrical and Computer Engineering, and Media Arts University of New Mexico Input and Interaction Ed Angel Professor of Computer Science, Electrical and Computer Engineering, and Media Arts University of New Mexico 1 Objectives Introduce the basic input devices - Physical Devices

More information

Input, Interaction and Animation Week 2

Input, Interaction and Animation Week 2 CS 432/637 INTERACTIVE COMPUTER GRAPHICS Input, Interaction and Animation Week 2 David Breen Department of Computer Science Drexel University Based on material from Ed Angel, University of New Mexico Objectives

More information

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

Graphics Programming. August 31, Programming of the Sierpinski gasket. Programming with OpenGL and C/C++ Computer Graphics Graphics Programming August 31, 2005 Contents Our Goal in This Chapter Programming of the Sierpinski gasket How To? Programming with OpenGL and C/C++ OpenGL API (Application Programmer

More information

Lectures Display List

Lectures Display List Lectures Display List By Tom Duff Pixar Animation Studios Emeryville, California and George Ledin Jr Sonoma State University Rohnert Park, California 2004, Tom Duff and George Ledin Jr 1 What is it? What

More information

GL_COLOR_BUFFER_BIT, GL_PROJECTION, GL_MODELVIEW

GL_COLOR_BUFFER_BIT, GL_PROJECTION, GL_MODELVIEW OpenGL Syntax Functions have prefix gl and initial capital letters for each word glclearcolor(), glenable(), glpushmatrix() glu for GLU functions glulookat(), gluperspective() constants begin with GL_,

More information

RECITATION - 1. Ceng477 Fall

RECITATION - 1. Ceng477 Fall RECITATION - 1 Ceng477 Fall 2007-2008 2/ 53 Agenda General rules for the course General info on the libraries GLUT OpenGL GLUI Details about GLUT Functions Probably we will not cover this part 3/ 53 General

More information

Computer Graphics (Basic OpenGL)

Computer Graphics (Basic OpenGL) Computer Graphics (Basic OpenGL) Thilo Kielmann Fall 2008 Vrije Universiteit, Amsterdam kielmann@cs.vu.nl http://www.cs.vu.nl/ graphics/ Computer Graphics (Basic OpenGL, Input and Interaction), ((57))

More information

Programming using OpenGL: A first Introduction

Programming using OpenGL: A first Introduction Programming using OpenGL: A first Introduction CMPT 361 Introduction to Computer Graphics Torsten Möller Machiraju/Zhang/Möller 1 Today Overview GL, GLU, GLUT, and GLUI First example OpenGL functions and

More information

Lectures OpenGL Introduction

Lectures OpenGL Introduction Lectures OpenGL Introduction By Tom Duff Pixar Animation Studios Emeryville, California and George Ledin Jr Sonoma State University Rohnert Park, California 2004, Tom Duff and George Ledin Jr 1 What is

More information

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

2/3/16. Interaction. Triangles (Clarification) Choice of Programming Language. Buffer Objects. The CPU-GPU bus. CSCI 420 Computer Graphics Lecture 3 CSCI 420 Computer Graphics Lecture 3 Interaction Jernej Barbic University of Southern California [Angel Ch. 2] Triangles (Clarification) Can be any shape or size Well-shaped triangles have advantages for

More information

OpenGL refresher. Advanced Computer Graphics 2012

OpenGL refresher. Advanced Computer Graphics 2012 Advanced Computer Graphics 2012 What you will see today Outline General OpenGL introduction Setting up: GLUT and GLEW Elementary rendering Transformations in OpenGL Texture mapping Programmable shading

More information

Overview of Graphics Systems Hearn & Baker Chapter 2. Some slides are taken from Robert Thomsons notes.

Overview of Graphics Systems Hearn & Baker Chapter 2. Some slides are taken from Robert Thomsons notes. Overview of Graphics Systems Hearn & Baker Chapter 2 Some slides are taken from Robert Thomsons notes. OVERVIEW Video Display Devices Raster Scan Systems Graphics Workstations and Viewing Systems Input

More information

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

Books, OpenGL, GLUT, GLUI, CUDA, OpenCL, OpenCV, PointClouds, and G3D Books, OpenGL, GLUT, GLUI, CUDA, OpenCL, OpenCV, PointClouds, and G3D CS334 Spring 2012 Daniel G. Aliaga Department of Computer Science Purdue University Computer Graphics Pipeline Geometric Primitives

More information

Exercise 1 Introduction to OpenGL

Exercise 1 Introduction to OpenGL Exercise 1 Introduction to OpenGL What we are going to do OpenGL Glut Small Example using OpenGl and Glut Alexandra Junghans 2 What is OpenGL? OpenGL Two Parts most widely used and supported graphics API

More information

CHAPTER 1 Graphics Systems and Models 3

CHAPTER 1 Graphics Systems and Models 3 ?????? 1 CHAPTER 1 Graphics Systems and Models 3 1.1 Applications of Computer Graphics 4 1.1.1 Display of Information............. 4 1.1.2 Design.................... 5 1.1.3 Simulation and Animation...........

More information

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

Teacher Assistant : Tamir Grossinger   Reception hours: by  - Building 37 / office -102 Assignments: 4 programing using Teacher Assistant : Tamir Grossinger email: tamirgr@gmail.com Reception hours: by email - Building 37 / office -102 Assignments: 4 programing using C++ 1 theoretical You can find everything you need in

More information

Basic Graphics Programming

Basic Graphics Programming 15-462 Computer Graphics I Lecture 2 Basic Graphics Programming Graphics Pipeline OpenGL API Primitives: Lines, Polygons Attributes: Color Example January 17, 2002 [Angel Ch. 2] Frank Pfenning Carnegie

More information

Computer Graphics - Chapter 1 Graphics Systems and Models

Computer Graphics - Chapter 1 Graphics Systems and Models Computer Graphics - Chapter 1 Graphics Systems and Models Objectives are to learn about: Applications of Computer Graphics Graphics Systems Images: Physical and Synthetic The Human Visual System The Pinhole

More information

Interaction. CSCI 420 Computer Graphics Lecture 3

Interaction. CSCI 420 Computer Graphics Lecture 3 CSCI 420 Computer Graphics Lecture 3 Interaction Jernej Barbic University of Southern California Client/Server Model Callbacks Double Buffering Hidden Surface Removal Simple Transformations [Angel Ch.

More information

CMP 477 Computer Graphics Module 2: Graphics Systems Output and Input Devices. Dr. S.A. Arekete Redeemer s University, Ede

CMP 477 Computer Graphics Module 2: Graphics Systems Output and Input Devices. Dr. S.A. Arekete Redeemer s University, Ede CMP 477 Computer Graphics Module 2: Graphics Systems Output and Input Devices Dr. S.A. Arekete Redeemer s University, Ede Introduction The widespread recognition of the power and utility of computer graphics

More information

Programming with OpenGL Part 1: Background

Programming with OpenGL Part 1: Background Programming with OpenGL Part 1: Background Ed Angel Professor of Computer Science, Electrical and Computer Engineering, and Media Arts University of New Mexico 1 Objectives Development of the OpenGL API

More information

Working with Callbacks

Working with Callbacks Working with Callbacks 1 Objectives Learn to build interactive programs using GLUT callbacks Mouse Keyboard Reshape Introduce menus in GLUT 2 The mouse callback glutmousefunc(mymouse) void mymouse(glint

More information

Early History of APIs. PHIGS and X. SGI and GL. Programming with OpenGL Part 1: Background. Objectives

Early History of APIs. PHIGS and X. SGI and GL. Programming with OpenGL Part 1: Background. Objectives Programming with OpenGL Part 1: Background Early History of APIs Objectives Development of the OpenGL API OpenGL Architecture - OpenGL as a state machine Functions - Types -Formats Simple program IFIPS

More information

Display Lists in OpenGL

Display Lists in OpenGL Display Lists in OpenGL Display lists are a mechanism for improving performance of interactive OpenGL applications. A display list is a group of OpenGL commands that have been stored for later execution.

More information

Computer Graphics Course 2005

Computer Graphics Course 2005 Computer Graphics Course 2005 Introduction to GLUT, GLU and OpenGL Administrative Stuff Teaching Assistant: Rony Goldenthal Reception Hour: Wed. 18:00 19:00 Room 31 (Ross 1) Questions: E-mail: cg@cs Newsgroups:

More information

Lecture 11: Callbacks. CITS 3003 Graphics & Animation

Lecture 11: Callbacks. CITS 3003 Graphics & Animation Lecture 11: Callbacks CITS 3003 Graphics & Animation Slides: E. Angel and D. Shreiner: Interactive Computer Graphics 6E Addison-Wesley 2012 Objectives Learn to build interactive programs using GLUT callbacks

More information

CS 543 Lecture 1 (Part II): Intro to OpenGL and GLUT (Part I) Emmanuel Agu

CS 543 Lecture 1 (Part II): Intro to OpenGL and GLUT (Part I) Emmanuel Agu CS 543 Lecture 1 (Part II): Intro to OpenGL and GLUT (Part I) Emmanuel Agu OpenGL Basics OpenGL s function Rendering Rendering? Convert geometric/mathematical object descriptions into images OpenGL can

More information

Programming with OpenGL Part 3: Three Dimensions

Programming with OpenGL Part 3: Three Dimensions Programming with OpenGL Part 3: Three Dimensions Ed Angel Professor of Computer Science, Electrical and Computer Engineering, and Media Arts University of New Mexico Objectives Develop a more sophisticated

More information

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

Lecture 2 Sections 3.6, 3.7. Fri, Aug 28, 2009 User User Lecture 2 Sections 3.6, 3.7 Hampden-Sydney College Fri, Aug 28, 2009 Outline User 1 2 3 4 5 User Definition ( ) A callback function is a programmer-specified function that the library will call

More information

Precept 2 Aleksey Boyko February 18, 2011

Precept 2 Aleksey Boyko February 18, 2011 Precept 2 Aleksey Boyko February 18, 2011 Getting started Initialization Drawing Transformations Cameras Animation Input Keyboard Mouse Joystick? Textures Lights Programmable pipeline elements (shaders)

More information

VR-programming tools (procedural) More VRML later in this course! (declarative)

VR-programming tools (procedural) More VRML later in this course! (declarative) Realtime 3D Computer Graphics & Virtual Reality OpenGL Introduction VR-programming Input and display devices are the main hardware interface to users Immersion embeds users through the generation of live-like

More information

User Interaction. User Interaction. Input devices. Input devices. Input devices GUIs and GUI design Event-driven programming 3D interaction

User Interaction. User Interaction. Input devices. Input devices. Input devices GUIs and GUI design Event-driven programming 3D interaction User Interaction User Interaction Input devices GUIs and GUI design Event-driven programming 3D interaction CS 465 lecture 19 2003 Steve Marschner 1 2003 Steve Marschner 2 Input devices Input devices Discrete

More information

Input and Interaction. CS 537 Interactive Computer Graphics Prof. David E. Breen Department of Computer Science

Input and Interaction. CS 537 Interactive Computer Graphics Prof. David E. Breen Department of Computer Science Input and Interaction CS 537 Interactive Computer Graphics Prof. David E. Breen Department of Computer Science E. Angel and D. Shreiner : Interactive Computer Graphics 6E Addison-Wesley 2012 1 Objectives

More information

OpenGL for dummies hello.c #include int main(int argc, char** argv) { glutinit(&argc, argv); glutinitdisplaymode (GLUT_SINGLE GLUT_RGB); glutinitwindowsize (250, 250); glutinitwindowposition

More information

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

ERKELEY DAVIS IRVINE LOS ANGELES RIVERSIDE SAN DIEGO SAN FRANCISCO EECS 104. Fundamentals of Computer Graphics. OpenGL ERKELEY DAVIS IRVINE LOS ANGELES RIVERSIDE SAN DIEGO SAN FRANCISCO SANTA BARBARA SANTA CRUZ EECS 104 Fundamentals of Computer Graphics OpenGL Slides courtesy of Dave Shreine, Ed Angel and Vicki Shreiner

More information

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

UNIVERSITY OF NEBRASKA AT OMAHA Computer Science 4620/8626 Computer Graphics Spring 2014 Homework Set 1 Suggested Answers UNIVERSITY OF NEBRASKA AT OMAHA Computer Science 4620/8626 Computer Graphics Spring 2014 Homework Set 1 Suggested Answers 1. How long would it take to load an 800 by 600 frame buffer with 16 bits per pixel

More information

CSC Graphics Programming. Budditha Hettige Department of Statistics and Computer Science

CSC Graphics Programming. Budditha Hettige Department of Statistics and Computer Science CSC 307 1.0 Graphics Programming Department of Statistics and Computer Science Graphics Programming GLUT 2 Events in OpenGL Event Example Keypress KeyDown KeyUp Mouse leftbuttondown leftbuttonup With mouse

More information

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

Programming with OpenGL Part 2: Complete Programs Computer Graphics I, Fall Programming with OpenGL Part 2: Complete Programs 91.427 Computer Graphics I, Fall 2008 1 1 Objectives Refine first program Alter default values Introduce standard program structure Simple viewing 2-D

More information

Computer Graphics, Chapt 08

Computer Graphics, Chapt 08 Computer Graphics, Chapt 08 Creating an Image Components, parts of a scene to be displayed Trees, terrain Furniture, walls Store fronts and street scenes Atoms and molecules Stars and galaxies Describe

More information

Using OpenGL with CUDA

Using OpenGL with CUDA Using OpenGL with CUDA Installing OpenGL and GLUT; compiling with nvcc Basics of OpenGL and GLUT in C Interoperability between OpenGL and CUDA OpenGL = Open Graphic Library creation of 3D graphic primitives

More information

CS 4204 Computer Graphics

CS 4204 Computer Graphics CS 4204 Computer Graphics OpenGL Basics Yong Cao Virginia Tech References: 2001 Siggraph, An Interactive Introduction to OpenGL Programming, Dave Shreiner,Ed Angel, Vicki Shreiner Official Presentation

More information

Introduction to OpenGL Week 1

Introduction to OpenGL Week 1 CS 432/680 INTERACTIVE COMPUTER GRAPHICS Introduction to OpenGL Week 1 David Breen Department of Computer Science Drexel University Based on material from Ed Angel, University of New Mexico Objectives

More information

Objectives. Image Formation Revisited. Physical Approaches. The Programmer s Interface. Practical Approach. Introduction to OpenGL Week 1

Objectives. Image Formation Revisited. Physical Approaches. The Programmer s Interface. Practical Approach. Introduction to OpenGL Week 1 CS 432/680 INTERACTIVE COMPUTER GRAPHICS Introduction to OpenGL Week 1 David Breen Department of Computer Science Drexel University Objectives Learn the basic design of a graphics system Introduce graphics

More information

Basic Graphics Programming

Basic Graphics Programming CSCI 480 Computer Graphics Lecture 2 Basic Graphics Programming January 11, 2012 Jernej Barbic University of Southern California http://www-bcf.usc.edu/~jbarbic/cs480-s12/ Graphics Pipeline OpenGL API

More information

SOURCES AND URLS BIBLIOGRAPHY AND REFERENCES

SOURCES AND URLS BIBLIOGRAPHY AND REFERENCES In this article, we have focussed on introducing the basic features of the OpenGL API. At this point, armed with a handful of OpenGL functions, you should be able to write some serious applications. In

More information

Graphics Systems and Models

Graphics Systems and Models Graphics Systems and Models 2 nd Week, 2007 Sun-Jeong Kim Five major elements Input device Processor Memory Frame buffer Output device Graphics System A Graphics System 2 Input Devices Most graphics systems

More information

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

Cameras (and eye) Ideal Pinhole. Real Pinhole. Real + lens. Depth of field Cameras (and eye) Ideal Pinhole Real Pinhole Real + lens Depth of field 1 Z-buffer How do we draw objects? Polygon Based Fast Raytracing Ray/Object intersections Slow Copyright Pixar 2 Raytracing for each

More information

Input and Interaction

Input and Interaction Input and Interaction 5 th Week, 2011 Graphical Input Devices Mouse Trackball Light Pen Data Tablet Joy Stick Space Ball Input Modes Input devices contain a trigger which can be used to send a signal to

More information

CSE4030 Introduction to Computer Graphics

CSE4030 Introduction to Computer Graphics CSE4030 Introduction to Computer Graphics Dongguk University Jeong-Mo Hong Week 2 The first step on a journey to the virtual world An introduction to computer graphics and interactive techniques How to

More information

API Background. Prof. George Wolberg Dept. of Computer Science City College of New York

API Background. Prof. George Wolberg Dept. of Computer Science City College of New York API Background Prof. George Wolberg Dept. of Computer Science City College of New York Objectives Graphics API history OpenGL API OpenGL function format Immediate Mode vs Retained Mode Examples The Programmer

More information

Ulf Assarsson Department of Computer Engineering Chalmers University of Technology

Ulf Assarsson Department of Computer Engineering Chalmers University of Technology Ulf Assarsson Department of Computer Engineering Chalmers University of Technology 1. I am located in room 4115 in EDIT-huset 2. Email: 3. Phone: 031-772 1775 (office) 4. Course assistant: Tomas Akenine-Mőller

More information

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

11/1/13. Basic Graphics Programming. Teaching Assistant. What is OpenGL. Course Producer. Where is OpenGL used. Graphics library (API) CSCI 420 Computer Graphics Lecture 2 Basic Graphics Programming Teaching Assistant Yijing Li Office hours TBA Jernej Barbic University of Southern California Graphics Pipeline OpenGL API Primitives: Lines,

More information

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

3D computer graphics: geometric modeling of objects in the computer and rendering them SE313: Computer Graphics and Visual Programming Computer Graphics Notes Gazihan Alankus, Spring 2012 Computer Graphics 3D computer graphics: geometric modeling of objects in the computer and rendering

More information

Lecture 3 Advanced Computer Graphics (CS & SE )

Lecture 3 Advanced Computer Graphics (CS & SE ) Lecture 3 Advanced Computer Graphics (CS & SE 233.420) Programming with OpenGL Program Structure Primitives Attributes and States Programming in three dimensions Inputs and Interaction Working with Callbacks

More information

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

CS559: Computer Graphics. Lecture 12: OpenGL Transformation Li Zhang Spring 2008 CS559: Computer Graphics Lecture 2: OpenGL Transformation Li Zhang Spring 28 Today Transformation in OpenGL Reading Chapter 3 Last time Primitive Details glpolygonmode(glenum face, GLenum mode); face:

More information

Programming with OpenGL Part 1: Background

Programming with OpenGL Part 1: Background Programming with OpenGL Part 1: Background Ed Angel Professor of Computer Science, Electrical and Computer Engineering, and Media Arts University of New Mexico 1 Objectives Development of the OpenGL API

More information

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

CS 543 Lecture 1 (Part 3) Prof Emmanuel Agu. Computer Science Dept. Worcester Polytechnic Institute (WPI) Computer Graphics CS 543 Lecture 1 (Part 3) Prof Emmanuel Agu Computer Science Dept. Worcester Polytechnic Institute (WPI) Recall: OpenGL Skeleton void main(int argc, char** argv){ // First initialize

More information

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

Computer Graphics (CS 543) Lecture 2b: 2D Graphics Systems (Drawing Polylines, tiling, & Aspect Ratio) Computer Graphics (CS 543) Lecture 2b: 2D Graphics Systems (Drawing Polylines, tiling, & Aspect Ratio) Prof Emmanuel Agu Computer Science Dept. Worcester Polytechnic Institute (WPI) Announcements All code

More information

Development of Computer Graphics

Development of Computer Graphics 1951 Whirlwind, Jay Forrester (MIT) CRT displays mid 1950s SAGE air defense system command & control CRT, light pens late 1950s Computer Art, James Whitney Sr. Visual Feedback loops 1962 Sketchpad, Ivan

More information

C OMPUTER G RAPHICS Thursday

C OMPUTER G RAPHICS Thursday C OMPUTER G RAPHICS 2017.04.27 Thursday Professor s original PPT http://calab.hanyang.ac.kr/ Courses Computer Graphics practice3.pdf TA s current PPT not uploaded yet GRAPHICS PIPELINE What is Graphics

More information

Computer Graphics. OpenGL

Computer Graphics. OpenGL Computer Graphics OpenGL What is OpenGL? OpenGL (Open Graphics Library) is a library for computer graphics It consists of several procedures and functions that allow a programmer to specify the objects

More information

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

Books, OpenGL, GLUT, CUDA, OpenCL, OpenCV, PointClouds, G3D, and Qt Books, OpenGL, GLUT, CUDA, OpenCL, OpenCV, PointClouds, G3D, and Qt CS334 Fall 2015 Daniel G. Aliaga Department of Computer Science Purdue University Books (and by now means complete ) Interactive Computer

More information

CS 432 Interactive Computer Graphics

CS 432 Interactive Computer Graphics CS 432 Interactive Computer Graphics Lecture 1 Part 3 Anatomy of OpenGL Programs Matt Burlick - Drexel University - CS 432 1 Reading Angel Chapter 2 Red Book Chapter 4 Matt Burlick - Drexel University

More information

Order of Transformations

Order of Transformations Order of Transformations Because the same transformation is applied to many vertices, the cost of forming a matrix M=ABCD is not significant compared to the cost of computing Mp for many vertices p Note

More information

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

Duc Nguyen CSE 420 Computer Graphics 10/10/2018 Homework 1 Duc Nguyen CSE 420 Computer Graphics 10/10/2018 Homework 1 1. The endpoints of a given line are (0, 0) and (18, 6). Compute the first 4 values of y manually using Bresenham's Line Algorithm as x steps

More information

Assignment 1. Simple Graphics program using OpenGL

Assignment 1. Simple Graphics program using OpenGL Assignment 1 Simple Graphics program using OpenGL In this assignment we will use basic OpenGL functions to draw some basic graphical figures. Example: Consider following program to draw a point on screen.

More information

Ulf Assarsson Department of Computer Engineering Chalmers University of Technology

Ulf Assarsson Department of Computer Engineering Chalmers University of Technology Ulf Assarsson Department of Computer Engineering Chalmers University of Technology Tracing Photons One way to form an image is to follow rays of light from a point source finding which rays enter the lens

More information

Computer Graphics 1 Computer Graphics 1

Computer Graphics 1 Computer Graphics 1 Projects: an example Developed by Nate Robbins Shapes Tutorial What is OpenGL? Graphics rendering API high-quality color images composed of geometric and image primitives window system independent operating

More information

Lecture 2 2D transformations Introduction to OpenGL

Lecture 2 2D transformations Introduction to OpenGL Lecture 2 2D transformations Introduction to OpenGL OpenGL where it fits what it contains how you work with it OpenGL parts: GL = Graphics Library (core lib) GLU = GL Utilities (always present) GLX, AGL,

More information