Chapter 12 Interactive Graphics
description
Transcript of Chapter 12 Interactive Graphics
![Page 1: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/1.jpg)
Chapter 12
Interactive Graphics
Chih-Kuo Yeh
![Page 2: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/2.jpg)
Interactive Graphics
![Page 3: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/3.jpg)
Picking
Direct Manipulation Demo
![Page 4: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/4.jpg)
Object Picking by Ray Tracing
p1
COPCenter of Projection
p2
WindowCoordinates
Object 1Object 2
![Page 5: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/5.jpg)
OpenGL Geometric Pipline
ModelviewTransformation
Vertex Coordinatesx, y, z, w
Object Coordinates
Eye Coordinates
Clip Coordinates
Device Coordinates
Window Coordinates x,y
ProjectionTransformation
PerspectiveDivision
ViewportTransformation
Modelview Matrix
Projection Matrix
Part of OpenGL State
ViewportTransformation
![Page 6: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/6.jpg)
OpenGL solution
SelectionFeedback
ApplicationModel
ApplicationProgram
GraphicsSystem
OutputDevices
InputDevices
API
Function Callsor Protocol
Data
![Page 7: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/7.jpg)
Selection
![Page 8: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/8.jpg)
planets.cpp
![Page 9: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/9.jpg)
The Basic Steps
glSelectBuffer(…)
ProcessSelection
glMatrixMode(GL_PROJECTION)
glPushMatrix()
glMatrixMode(GL_PROJECTION)
glPopMatrix()
Change render mode
![Page 10: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/10.jpg)
The Basic Steps
glRenderMode(GL_SELECT )
glRenderMode(GL_RENDER )
RenderScene()
gluPickMatrix(…)
Change render mode
![Page 11: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/11.jpg)
The Basic Steps
glInitNames()
glPushName()
glLoadName(…)
RenderScene
Draw your object 1
glLoadName(…)
Draw your object 2
![Page 12: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/12.jpg)
Selection Mode
GLint glRenderMode(GLenum mode);Mode = 1. GL_RENDER (the default)2. GL_SELECT3. GL_FEEDBAC
glRenderMode()
GL_RENDER
GL_SELECT
1
zmin
zmax
Yellow Cube
glRenderMode(GL_RENDER) returns the number of hits while in SELECT mode
![Page 13: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/13.jpg)
Picking
void gluPickMatrix(GLdouble x, GLdouble y, GLdouble width, GLdouble height, GLint viewport[4]);
glGetIntegerv(GL_VIEWPORT, viewport);
gluPickMatrix(xPos, viewport[3] – yPos + viewport[1], 2,2, viewport);
![Page 14: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/14.jpg)
Picking in OpenGL
y
xz
z
x
y
Plane z= -1
Plane z= +1
DOP
z
x
y
Perspective View Volume Canonical View Volume
Projection
TransformPick MatrixTransform
Screen Coordinates
![Page 15: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/15.jpg)
The Hit Record
Each hit record consists of four items, in order.1. The number of names on the name stack when
the hit occurred.2. Both the minimum and maximum window-
coordinate z values 3. The contents of the name stack at the time of
the hit, with the bottommost element first.
![Page 16: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/16.jpg)
Selection Buffer
![Page 17: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/17.jpg)
planets.cpp
void RenderScene(void){
// Clear the window with current clearing colorglClear(GL_COLOR_BUFFER_BIT | GL_DEPTH_BUFFER_BIT);
// Save the matrix state and do the rotationsglMatrixMode(GL_MODELVIEW);glPushMatrix();
// Translate the whole scene out and into viewglTranslatef(0.0f, 0.0f, -300.0f);
// Initialize the names stackglInitNames();glPushName(0);
// Name and draw the SunglColor3f(1.0f, 1.0f, 0.0f);glLoadName(SUN);DrawSphere(15.0f);
// Draw MercuryglColor3f(0.5f, 0.0f, 0.0f);glPushMatrix();glTranslatef(24.0f, 0.0f, 0.0f);glLoadName(MERCURY);DrawSphere(2.0f);glPopMatrix();
// Draw VenusglColor3f(0.5f, 0.5f, 1.0f);glPushMatrix();glTranslatef(60.0f, 0.0f, 0.0f);glLoadName(VENUS);DrawSphere(4.0f);glPopMatrix();
// Draw the EarthglColor3f(0.0f, 0.0f, 1.0f);glPushMatrix();glTranslatef(100.0f,0.0f,0.0f);glLoadName(EARTH);DrawSphere(8.0f);glPopMatrix();
// Draw MarsglColor3f(1.0f, 0.0f, 0.0f);glPushMatrix();glTranslatef(150.0f, 0.0f, 0.0f);glLoadName(MARS);DrawSphere(4.0f);glPopMatrix();
// Restore the matrix stateglPopMatrix(); // Modelview matrix
glutSwapBuffers();}
![Page 18: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/18.jpg)
void MouseCallback(int button, int state, int x, int y){
if(button == GLUT_LEFT_BUTTON && state == GLUT_DOWN)ProcessSelection(x, y);
}
![Page 19: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/19.jpg)
ProcessSelection(int xPos, int yPos)
void ProcessSelection(int xPos, int yPos){
GLfloat fAspect;
// Space for selection bufferstatic GLuint selectBuff[BUFFER_LENGTH];
// Hit counter and viewport storageGLint hits, viewport[4];
// Setup selection bufferglSelectBuffer(BUFFER_LENGTH, selectBuff);
![Page 20: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/20.jpg)
// Get the viewportglGetIntegerv(GL_VIEWPORT, viewport);
// Switch to projection and save the matrixglMatrixMode(GL_PROJECTION);glPushMatrix();
// Change render modeglRenderMode(GL_SELECT);
![Page 21: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/21.jpg)
glLoadIdentity();gluPickMatrix(xPos, viewport[3] - yPos + viewport[1], 2,2, viewport);
// Apply perspective matrix fAspect = (float)viewport[2] / (float)viewport[3];gluPerspective(45.0f, fAspect, 1.0, 425.0);
// Draw the sceneRenderScene();
// Collect the hitshits = glRenderMode(GL_RENDER);
![Page 22: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/22.jpg)
GLuint nErr = glGetError();// If a single hit occurred, display the info.if(hits == 1)
ProcessPlanet(selectBuff[3]);else
glutSetWindowTitle("Nothing was clicked on!");
// Restore the projection matrixglMatrixMode(GL_PROJECTION);glPopMatrix();
// Go back to modelview for normal renderingglMatrixMode(GL_MODELVIEW);
![Page 23: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/23.jpg)
Hierarchical Picking
![Page 24: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/24.jpg)
Hierarchical Picking
![Page 25: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/25.jpg)
Moons.cpp
![Page 26: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/26.jpg)
![Page 27: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/27.jpg)
Selection Buffer
glSelectBuffer( int size, int *pBuffer );
Set up Pick Buffer
Selection Buffer: user specified integer array
![Page 28: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/28.jpg)
Name Stack
stack pointer
Set up Pick Buffer
Initialize Name Stack
glRenderMode( GL_SELECT );glInitNames();
![Page 29: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/29.jpg)
Pick Volume
gluPickMatrix( x, y, 5.0, 5.0, viewport );
Initialize Name Stack
Set up Pick Buffer
Specify a Pick Volume
![Page 30: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/30.jpg)
Fill Selection Buffer
glPushName(100);1 0 0 100
Specify a Pick Volume
Initialize Name Stack
Set up Pick Buffer
Draw Object with IDs
100
glDrawRedRect();
![Page 31: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/31.jpg)
Fill Selection Buffer
glPushName(200);1 0 0 100 2 0 0 100 200
Specify a Pick Volume
Draw Object with IDs
Initialize Name Stack
Set up Pick Buffer
200100
glDrawGreenRect();
![Page 32: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/32.jpg)
Fill Selection Buffer
1 0 0 100 2 0 0 100 200
100200300
Specify a Pick Volume
Draw Object with IDs
Initialize Name Stack
Set up Pick Buffer
glPushName(300);
glDrawBlueRect();
![Page 33: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/33.jpg)
Post Processing
Do anything you want !!!
Specify a Pick Volume
Draw Object with IDs
Initialize Name Stack
Set up Pick Buffer
Post Processing
gRenderMode( GL_RENDER );
![Page 34: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/34.jpg)
Feedback
![Page 35: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/35.jpg)
select.cpp
![Page 36: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/36.jpg)
The Basic Steps
glSelectBuffer(…)
ProcessSelection
glMatrixMode(GL_PROJECTION)
glPushMatrix()
glMatrixMode(GL_PROJECTION)
glPopMatrix()
Change render mode
![Page 37: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/37.jpg)
The Basic Steps
glRenderMode(GL_SELECT )
glRenderMode(GL_RENDER )
RenderScene()
gluPickMatrix(…)
Change render mode
![Page 38: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/38.jpg)
The Basic Steps
glInitNames()
glPushName()
RenderScene
glLoadName(…)
Draw your object 1
glPassThrough(…)
glLoadName(…)
glPassThrough(…)
![Page 39: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/39.jpg)
The Basic Steps
glRenderMode(GL_FEEDBACK )
glRenderMode(GL_RENDER )
RenderScene()
glFeedbackBuffer(…)
MakeSelection
Parse the feedback buffer
![Page 40: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/40.jpg)
The Feedback Buffer
void glFeedbackBuffer(GLsizei size, GLenum type, GLfloat *buffer);
![Page 41: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/41.jpg)
Feedback Buffer Tokens
![Page 42: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/42.jpg)
Feedback Buffer Memory
GL_3D type
![Page 43: Chapter 12 Interactive Graphics](https://reader035.fdocuments.net/reader035/viewer/2022081503/568148f3550346895db61094/html5/thumbnails/43.jpg)
Feedback Buffer Memory
[0] GL_PASS_THROUGH_TOKEN[1] User defined name[2] GL_POLYGON_TOKEN[3] Number of vertices[4] x[5] y See MakeSelection(int nChoice) for detail