Pointer click order of scene.onPointerObservable and ActionManager.OnPickTrigger

I’m trying to sort out click events when clicking on my scene. On clicking the mesh, I want a GUI rectangle to show rect.isVisible = true;. And when I click elsewhere, I want the rectangle to hide rect.isVisible = false;

However, it seems like the scene click logic runs after the mesh click logic. Meaning my rect becomes visible, then invisible right after on a the mesh click. Is there a way to swap the order around? If not, is there another way I achieve my goal?

Comment and uncomment the isVisible statements to see that the hiding/unhiding works.

https://playground.babylonjs.com/#ZG9LUW#3

https://playground.babylonjs.com/#ZG9LUW#4

Does this work?

You can specify which object you want as well by checking if(pointerInfo.pickInfo.pickedMesh == sphere)

This is a little bit cleaner in my opinion:
https://playground.babylonjs.com/#ZG9LUW#5

2 Likes