Prevent Mobile Pinch Move Gesture

So I use ARCROTATECAMERA and it works amazing in desktop. But somehow in mobile devices, when we pinch for zooming, the camera can be moved around while pinching the screen.

Is there a way to disable this?

Hi Alvin,

Do you mean that when zooming in/out using the pinch gesture that camera can also be “repositioned” ? This is probably due to the panning feature (which is enabled when you move two fingers across the screen). You can disable it here - Babylon.js/arcRotateCameraPointersInput.ts at master · BabylonJS/Babylon.js · GitHub

1 Like

Hi @RaananW,

Actually how to disable the right click function. The right click on “ArcRotateCamera” will move the camera. I want this to be disabled, so the user can only rotate and zoom, but not moving the camera.

This is the panning as well. You will simply need to disable panning by either asking the camera to use the control key instead of the right click or setting the panningSensibility of the arc rotate pointer input to 0. Notice the signature of the attach function of the arc rotate:

public attachControl(element: HTMLElement, noPreventDefault?: boolean, useCtrlForPanning: boolean = true, panningMouseButton: number = 2)

you can define useCtrlForPanning to true, or even “hack” the system, by setting the panning button to be some non-existent button (like 3, or 4, or 42). Panning won’t work afterwards.

1 Like

Thank you @RaananW, It is working now on desktop browser, the right click is disabled, but in mobile devices, I can still move the camera around when pinching with 2 fingers and moving it.

This is the code I use to attach the control:

$scope.camera.attachControl($scope.canvas, false, true, 5);

Any idea why?

You should try to put the panningSensibility to 0 this should prevent any panning from happening.

1 Like

Thanks it works now.