Difference between revisions of "Discussion7S16"

From Immersive Visualization Lab Wiki
Jump to: navigation, search
(Created page with "==Overview== Week 7 Discussion recap(05/09/16) Slides: [http://ivl.calit2.net/wiki/images/2/25/Week_7_DiscussionS16.pdf Download here] ==Bezier Curves== ==Selection Buffers...")
 
(Selection Buffers: Initial draft.)
Line 7: Line 7:
  
 
==Selection Buffers==
 
==Selection Buffers==
[http://www.lighthouse3d.com/tutorials/opengl-selection-tutorial/ OpenGL Picking Tutorial]
+
Have you ever wondered how those light gun controllers for arcade games or console games worked? In Nintendo's game Duck Hunt, for example, the player points the light gun at a duck and push the trigger, and the game somehow registers that you hit the duck! The hint is in the fact that the name gun is actually a red herring.
 +
 
 +
The moment the player pushes the trigger, what happens is the whole image is redrawn—faster than the human eye can catch. This special re-render essentially draws all the shootable objects(e.g. ducks for Duck Hunt) in white, but everything else in black. Then, the light gun—equipped with a photodiode sensor—reads the specially redrawn image and senses whether the player pointed at a white portion or not, meaning the "gun" is actually more like a camera, and receives light instead of shooting light. (Read more [https://en.wikipedia.org/wiki/Light_gun here] and [http://www.howtogeek.com/181303/htg-explains-how-the-nintendo-zapper-worked-and-why-it-doesnt-work-on-new-tvs/ here])
 +
 
 +
===Borrowing Old Ideas===
 +
For doing selection in 3D, we can use a similar idea. When a user clicks, we redraw the whole scene with a special render, coloring each selectable object with a unique color.
 +
 
 +
In order to do this, first we need to assign each object a unique ID that identifies what we've just selected. Let's look at the following chess pieces, and the following assigned IDs:
 +
 
 +
[[File:Selectionbuffer00.PNG|500px]]
 +
 
 +
Now after we render this, we want to be able to retrieve the ID of each object back from the render. How might we accomplish that?
 +
 
 +
Well one way to do it would be to directly use the ID as the color! So ID 0 will be the darkest, and ID 3 will be the brightest object in this render. For example:
 +
 
 +
[[File:Selectionbuffer01.jpg|500px]]
 +
 
 +
Great! Now when the user had clicked object 3 for example, they can read that pixel, see what the brightness is, and try to find out what object's color that matches to!
 +
 
 +
The grayscale image up there is the '''Selection Buffer''' rendering. In that particular selection buffer, we've exaggerated the differences between each of the objects. In a more typical setting you might use the color <code>vec4(id/255.0f, 0.0f, 0.0f, 1.0f)</code>, meaning that each of those objects will actually be quite close in color.
 +
 
 +
===The Code===
 +
So how do we implement this in OpenGL? Well, we first need the subroutine to redraw the selection buffer. Let's implement a method <code>selectionDraw</code> that draws the object, but with the selection shader instead. The ID is going to be remembered per selectable object we create. This ID will then be sent to our selection shader, which simply colors the whole object with a flat color based on that ID.
 +
 
 +
[[File:Selectionbuffercode00.PNG|700px]]
 +
 
 +
What about the Vertex shader you ask? Well we're drawing the object the same way that it's normally drawn in our display buffer. What should our vertex shader be then?
 +
 
 +
Now let's handle the case when we actually call all the <code>selectionDraw</code>s. This will happen on mouse click so we'd place it in our <code>Window</code> class's <code>mouse_button_callback</code>. On a left-button click, we draw every selectable object with the <code>selectionShader</code>, and then call <code>glReadPixels</code> to get the pixel value of where the user clicked. If we clicked an actual selectable, we're in essence retrieving the color that the <code>selection.frag</code> shader colored our object with.
 +
 
 +
Now all we need is some basic type conversion and we're good!
 +
 
 +
[[File:Selectionbuffercode01.PNG|700px]]
 +
 
 +
So we've gotten the object that we've selected. How do we now move that selection? Well that will be left as an exercise for the reader. :)
 +
 
 +
You can read more on this in the [http://www.lighthouse3d.com/tutorials/opengl-selection-tutorial/ Lighthouse 3D-Picking Tutorial]
  
 
==Raycast==
 
==Raycast==
 
[http://antongerdelan.net/opengl/raycasting.html Ray Casting Notes]
 
[http://antongerdelan.net/opengl/raycasting.html Ray Casting Notes]

Revision as of 02:09, 10 May 2016

Contents

Overview

Week 7 Discussion recap(05/09/16)

Slides: Download here

Bezier Curves

Selection Buffers

Have you ever wondered how those light gun controllers for arcade games or console games worked? In Nintendo's game Duck Hunt, for example, the player points the light gun at a duck and push the trigger, and the game somehow registers that you hit the duck! The hint is in the fact that the name gun is actually a red herring.

The moment the player pushes the trigger, what happens is the whole image is redrawn—faster than the human eye can catch. This special re-render essentially draws all the shootable objects(e.g. ducks for Duck Hunt) in white, but everything else in black. Then, the light gun—equipped with a photodiode sensor—reads the specially redrawn image and senses whether the player pointed at a white portion or not, meaning the "gun" is actually more like a camera, and receives light instead of shooting light. (Read more here and here)

Borrowing Old Ideas

For doing selection in 3D, we can use a similar idea. When a user clicks, we redraw the whole scene with a special render, coloring each selectable object with a unique color.

In order to do this, first we need to assign each object a unique ID that identifies what we've just selected. Let's look at the following chess pieces, and the following assigned IDs:

Selectionbuffer00.PNG

Now after we render this, we want to be able to retrieve the ID of each object back from the render. How might we accomplish that?

Well one way to do it would be to directly use the ID as the color! So ID 0 will be the darkest, and ID 3 will be the brightest object in this render. For example:

Selectionbuffer01.jpg

Great! Now when the user had clicked object 3 for example, they can read that pixel, see what the brightness is, and try to find out what object's color that matches to!

The grayscale image up there is the Selection Buffer rendering. In that particular selection buffer, we've exaggerated the differences between each of the objects. In a more typical setting you might use the color vec4(id/255.0f, 0.0f, 0.0f, 1.0f), meaning that each of those objects will actually be quite close in color.

The Code

So how do we implement this in OpenGL? Well, we first need the subroutine to redraw the selection buffer. Let's implement a method selectionDraw that draws the object, but with the selection shader instead. The ID is going to be remembered per selectable object we create. This ID will then be sent to our selection shader, which simply colors the whole object with a flat color based on that ID.

Selectionbuffercode00.PNG

What about the Vertex shader you ask? Well we're drawing the object the same way that it's normally drawn in our display buffer. What should our vertex shader be then?

Now let's handle the case when we actually call all the selectionDraws. This will happen on mouse click so we'd place it in our Window class's mouse_button_callback. On a left-button click, we draw every selectable object with the selectionShader, and then call glReadPixels to get the pixel value of where the user clicked. If we clicked an actual selectable, we're in essence retrieving the color that the selection.frag shader colored our object with.

Now all we need is some basic type conversion and we're good!

Selectionbuffercode01.PNG

So we've gotten the object that we've selected. How do we now move that selection? Well that will be left as an exercise for the reader. :)

You can read more on this in the Lighthouse 3D-Picking Tutorial

Raycast

Ray Casting Notes