GPU mouse picking OpenGL/WebGL

Question

I understand i need to render only 1x1 or 3x3 pixel part of the screen where the mouse is, with object id's as colors and then get id from the color.

I have implemented ray-cast picking with spheres and i am guessing it has something to do with making camera look in direction of the mouse ray?

How do i render the correct few pixels?

Edit:

setting camera in direction of mouse ray works, but if i make the viewport smaller the picture scales but what (i think) i need is for it to be cropped rather than scaled. How would i achieve this?

Answer 1

The easiest solution is to use the scissor test. It allows you to render only pixels within a specified rectangular sub-region of your window.

For example, to limit your rendering to 3x3 pixels centered at pixel (x, y):

glScissor(x - 1, y - 1, 3, 3);
glEnable(GL_SCISSOR_TEST);
glDraw...(...);
glDisable(GL_SCISSOR_TEST);

Note that the origin of the coordinate system is at the bottom left of the window, while most window systems will give you mouse coordinates in a coordinate system that has its origin at the top left. If that's the case on your system, you will have to invert the y-coordinate by subtracting it from windowHeight - 1.