GPU Picking inconsistent across devices

I’m trying to implement GPU picking with Points using code I modified from the latter half of this article

It’s been working fine for me on desktop, but I started testing different browsers and devices and it doesn’t work consistently. I made a Codepen to illustrate https://codepen.io/deklanw/pen/OJVVmEd?editors=1111

If you click (or tap) on the nodes their IDs should pop up in the console. On some devices I’m just getting 0, as in picking the background.

Anyone know why?

edit:
Also, if there’s a way to do picking in this case with another easier method that’s still performant, I’m curious about how

Still stuck on this. I’m using a kdtree for other purposes, if I can use that for picking somehow instead that would probably work out

/cc

Can you please use the following example to verify if the devices produce actually different results?

https://threejs.org/examples/webgl_read_float_buffer

If the example works for you, there is probably something wrong with your code.

1 Like

The only device I have which doesn’t work with my code above is a touch device. So, I can’t test that code myself. But, a person with a desktop Mac for whom my code doesn’t work told me that the above link works for him.

So I experimented with removing the 1x1 render target optimization and it worked for my tablet. Now I’m wondering what about the 1x1 rendering target breaks it. I assumed it was something to do with pixelRatio but my phone has a pixelRatio > 1 and it has always worked fine.

See https://github.com/mrdoob/three.js/pull/15194

Any ideas?