# How to limit camera rotate from drag?

**URL:** <https://forum.babylonjs.com/t/how-to-limit-camera-rotate-from-drag/43126>\
**Category:** Questions\
**Created:** [August 9, 2023, 5:30am UTC](https://forum.babylonjs.com/t/how-to-limit-camera-rotate-from-drag/43126 "2023-08-09T05:30:47Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![daehan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/daehan/32/33688_2.png) [@daehan](https://forum.babylonjs.com/u/daehan)\
**Post date:** [August 9, 2023, 5:30am UTC](https://forum.babylonjs.com/t/how-to-limit-camera-rotate-from-drag/43126/1 "2023-08-09T05:30:48Z")

</div>

Try to chatting app using babylon Js  
I want to limit camera rotation to give feel people talk at front  
So I try to limit rotation by those code

at first I put this code in the onSceneReady part

```auto
var camera = new BABYLON.ArcRotateCamera("Camera", -Math.PI / 2, Math.PI / 2, 5, BABYLON.Vector3.Zero(), scene);
const canvas = scene.getEngine().getRenderingCanvas();
camera.panningSensibility = 15;
camera.lowerRadiusLimit = 200;
camera.upperRadiusLimit = 800;
camera.lowerAlphaLimit = 0;
camera.upperAlphaLimit = Math.PI / 18;
camera.lowerBetaLimit = Math.PI / 3;
camera.upperBetaLimit = Math.PI / 3;

//camera.panningAxis = new BABYLON.Vector3(1, 1, 0);

camera.useAutoRotationBehavior = true;
camera.autoRotationBehavior.idleRotationSpeed = -.1;

scene.onBeforeCameraRenderObservable.add((camera) => {
if (camera.alpha >= camera.upperAlphaLimit
|| camera.alpha <= camera.lowerAlphaLimit) {
camera.autoRotationBehavior.idleRotationSpeed *= -1;
}
});

// This targets the camera to scene origin
camera.setTarget(BABYLON.Vector3.Zero());

// This attaches the camera to the canvas
camera.attachControl(canvas, true);

```

and also add limitation onReder

```auto
const onRender = (scene) => {
let camera = scene.getCameraByName("camera");
if (camera.radius > 70) camera.radius = 20; if (camera.radius < 5) camera.radius = 5

```

but camera still rotate freely when I dragging

the source code is here

> **[GitHub - daehaha/babylon\_lab](https://github.com/daehaha/babylon_lab)**
>
> Contribute to daehaha/babylon\_lab development by creating an account on GitHub.

how to I limit ? as like people head ?

---

<div class="post-metadata">

**Author:** ![11128](https://avatars.discourse-cdn.com/v4/letter/1/d07c76/32.png) [@11128](https://forum.babylonjs.com/u/11128)\
**Post date:** [August 9, 2023, 5:57am UTC](https://forum.babylonjs.com/t/how-to-limit-camera-rotate-from-drag/43126/2 "2023-08-09T05:57:20Z")

</div>

If the camera alpha is 0 looking straight ahead  
try to this

> camera.lowerAlphaLimit = Math.PI / 2;  
> camera.upperAlphaLimit = Math.PI / 2;

will have a radius of 180 degrees from the frontal reference

and this

> camera.lowerRadiusLimit = 200;  
> camera.upperRadiusLimit = 800;

The meaning of this is literally a limit, so the  
You shouldn’t try to apply a radius beyond that number in your render, so the  
look at the limit in your code

> camera.lowerRadiusLimit = 5;  
> camera.upperRadiusLimit = 20;

And we don’t need to put this in the render, remove it  
That’s it.

---

<div class="post-metadata">

**Author:** ![daehan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/daehan/32/33688_2.png) [@daehan](https://forum.babylonjs.com/u/daehan)\
**Post date:** [August 9, 2023, 6:20am UTC](https://forum.babylonjs.com/t/how-to-limit-camera-rotate-from-drag/43126/3 "2023-08-09T06:20:11Z")

</div>

Thanks it worked 🙂 😊