GPU Picking with mouse coordinate

Questions
1

Hello,

I am trying to recreate this example in BabylonJS on a flat plane: Three.js Indexed Textures for Picking and Color

But before getting to the end goal, I was wondering if this first step is possible. I was wondering if it is possible to get a pixel value of a texture based on a UV coordinate of another texture. Basically, say you have a quad with whatever texture on it. Then, when you hover over the quad with a mouse, get the UV coordinate of the mouse position that intersects with the texture. Then, get the value of a pixel from a different quad with a different texture on it using that UV coordinate. Is this possible or is there a better way?

I’m a beginner to WebGL and BabylonJS. I apologize if my explanation is confusing. Please let me know and I will try to be more clear.

Thank you for your help.

2

The pick function will provide you with the uv coordinates which you can use to map information from the texture itself. for example:

https://playground.babylonjs.com/#NU4F6Y#230 - notice line 23.
You can also do it with mapping on the mesh itself (using pickResult.pickedPoint)

You can read about it here:

https://doc.babylonjs.com/babylon101/picking_collisions

Is that what you were looking for?

3 Likes
3

Thank you! BabylonJs is amazing!

1 Like
4

The picking works for a single mesh really well, but is it possible to pick multiple meshes? I have a few quads that are overlapping and it seems to return just one.

5

You can use scene.multiPick in that case:
https://doc.babylonjs.com/api/classes/babylon.scene#multipick

6

Are you implement GPUPicker？Can you share it on PG?

7

Hi @kekeqy, this should be helpful to you: GPU picking demo