How can I return values calculated by my custom shaders to my JS code? I am working on an instancing shader that should return the index of any instance under the mouse pointer.
This type of question was already asked at many other forums or boards:
You can read values from a render target (your target framebuffer) via WebGLRenderer.readRenderTargetPixels().
There’s an approach described here
Thanks,
I got it working, but since my plants are waving, it is not pixel-perfect.
I want to try another approach: I want to rendering the id of the instance as a color to a texture of the same size as the screen, and then simply read the pixel color to see what instance was picked.
One thing I need to find out, is if the shader knows what instance it is processing. Is there a variable that can tell me this?
I think gl_InstanceID
is what you’re looking for:
https://www.khronos.org/opengl/wiki/Built-in_Variable_(GLSL)
But i don’t think it’s available in WebGL.
Do you mind me asking why the approach from the article is not working? Why cant you make your own index in whatever format/precision you need?
Well, the picking is based on the bounding box of the static object, and not the object in the current phase of the waving cycle.
Oh I see, that makes sense.