Release camera rotation when pointer outside bounds

I am using an ArcRotate camera that rotates with the mouse pointer on pointer down + drag. However, when I release the mouse outside of babylonjs canvas, and bring the pointer back inside, the camera is still rotating even though the mouse pointer is no longer pressed. I am integrating babylonjs canvas into a div container.
How do I resolve this issue?
I want the camera to stop rotating when the mouse pointer is outside the canvas or out of bounds.

Hello, can you share a reproduction?

Please click on the babylonjs icon to open the iframe.


One solution can be: Check the mouse coordinates and if it is in a certain distance from the canvas edge detach the camera control, otherwise enable it.

The code works on the left side of the canvas, you can easily modify it for all edges.



1 Like