CSS2DObject Click/PointerUp events not working with OrbitControls

Discussion
, , ,
1

Hello all,

I know there are workarounds for this issue mentioned multiple times in other questions (see list). But replacing click for pointerdown is not always a good solution, as some interfaces need pointerup events to work separately from the click/down events, not just for CSS reasons, but for more advanced logical ones too.

I’d like to understand if this is a by-design limitation of both features working together, or if we should open an issue for this in the repo so it gets attention eventually.

If there are any workaround for that as well not yet mentioned in other answers, which works for separate pointer up/down events, we’d be very grateful to know.

Thanks for the attention.

2

Here are 2 examples of using OrbitControls, CSS2DObjects and click event interaction.
Example 1 : Annotations - Three.js Tutorials
Example 2 : Glasses - Three.js Tutorials
Press the <> in the working examples to see the JS.

There is no usage of pointerup in these examples, but example 1 uses click and dblclick, example 2 uses pointerdown

And here is a 3rd example if you are interested in React Three Fiber
Example 3 : House - React Three Fiber Tutorials

2 Likes