# Changing the increments of camera movement when using the keyboard

**URL:** <https://forum.babylonjs.com/t/changing-the-increments-of-camera-movement-when-using-the-keyboard/22344>\
**Category:** Questions\
**Created:** [July 13, 2021, 11:57am UTC](https://forum.babylonjs.com/t/changing-the-increments-of-camera-movement-when-using-the-keyboard/22344 "2021-07-13T11:57:30Z")\
**Posts on this page:** 8\
**Page:** 1

<div class="post-metadata">

**Author:** ![EvilTwinsNiceBrother](https://avatars.discourse-cdn.com/v4/letter/e/51bf81/32.png) [@EvilTwinsNiceBrother](https://forum.babylonjs.com/u/EvilTwinsNiceBrother)\
**Post date:** [July 13, 2021, 11:57am UTC](https://forum.babylonjs.com/t/changing-the-increments-of-camera-movement-when-using-the-keyboard/22344/1 "2021-07-13T11:57:30Z")

</div>

Hello,  
is there a way to change the increments by which the camera moves when I use the arrow keys on the keyboard?  
Also:  
I’d like to create an on-screen keyboard control representing the arrow and zoom keys.  
Do i need to write my own camera control handler for that, or can I tap into the existing methods called by the keyboard?

Thanks a lot.

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [July 13, 2021, 2:24pm UTC](https://forum.babylonjs.com/t/changing-the-increments-of-camera-movement-when-using-the-keyboard/22344/2 "2021-07-13T14:24:36Z")

</div>

I totally depends on the type of camera you are using so a tiny playground would help but there are usually various controls to change keys or speed on all of them

---

<div class="post-metadata">

**Author:** ![EvilTwinsNiceBrother](https://avatars.discourse-cdn.com/v4/letter/e/51bf81/32.png) [@EvilTwinsNiceBrother](https://forum.babylonjs.com/u/EvilTwinsNiceBrother)\
**Post date:** [July 14, 2021, 11:36am UTC](https://forum.babylonjs.com/t/changing-the-increments-of-camera-movement-when-using-the-keyboard/22344/3 "2021-07-14T11:36:06Z")

</div>

I am using the ArcRotateCamera:  
Created a playground here:  
[https://playground.babylonjs.com/#R2PXZA#4](https://playground.babylonjs.com/#R2PXZA#4)  
I would like to call the same functionality for the buttons that the hardware kayboard keys are using.  
Thanks!

---

<div class="post-metadata">

**Author:** ![EvilTwinsNiceBrother](https://avatars.discourse-cdn.com/v4/letter/e/51bf81/32.png) [@EvilTwinsNiceBrother](https://forum.babylonjs.com/u/EvilTwinsNiceBrother)\
**Post date:** [July 14, 2021, 7:08pm UTC](https://forum.babylonjs.com/t/changing-the-increments-of-camera-movement-when-using-the-keyboard/22344/4 "2021-07-14T19:08:49Z")

</div>

So I messed around with this and added:

```auto
let pos = camera.position.clone();
pos.z+= 0.5;
BABYLON.Animation.CreateAndStartAnimation("cameraAnimationZ", camera, "position", 60, 120, camera.position, pos, 0);

```

In the zoom Button Handler  
That does not do anything unfortunately.  
I guess I am missing something?  
here is the playground:  
[https://playground.babylonjs.com/#R2PXZA#5](https://playground.babylonjs.com/#R2PXZA#5)

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [July 14, 2021, 11:35pm UTC](https://forum.babylonjs.com/t/changing-the-increments-of-camera-movement-when-using-the-keyboard/22344/5 "2021-07-14T23:35:39Z")

</div>

Your main issue is that you animate camera but in your importMesh function you are actually creating another camera with createDefaultLightOrCamera. You should animate the newly created one.

---

<div class="post-metadata">

**Author:** ![PolygonalSun](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/polygonalsun/32/2704_2.png) [@PolygonalSun](https://forum.babylonjs.com/u/PolygonalSun)\
**Post date:** [July 15, 2021, 12:00am UTC](https://forum.babylonjs.com/t/changing-the-increments-of-camera-movement-when-using-the-keyboard/22344/6 "2021-07-15T00:00:06Z")

</div>

Just as an FYI, if you use the default camera controls and want to adjust the speed of camera movements, you can reference the keyboard inputs directly and modify the `angularSpeed`

```auto
var camera = // Your ArcRotateCamera
...
// Default speed is 0.01
camera.inputs.attached.keyboard.angularSpeed = 0.01

```

---

<div class="post-metadata">

**Author:** ![sebavan](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/sebavan/32/57_2.png) [@sebavan](https://forum.babylonjs.com/u/sebavan)\
**Post date:** [July 15, 2021, 12:04am UTC](https://forum.babylonjs.com/t/changing-the-increments-of-camera-movement-when-using-the-keyboard/22344/7 "2021-07-15T00:04:05Z")

</div>

Thanks a lot @PolygonalSun , I focused too much on the second question I forgot of the first one 🙂

---

<div class="post-metadata">

**Author:** ![EvilTwinsNiceBrother](https://avatars.discourse-cdn.com/v4/letter/e/51bf81/32.png) [@EvilTwinsNiceBrother](https://forum.babylonjs.com/u/EvilTwinsNiceBrother)\
**Post date:** [July 15, 2021, 10:14am UTC](https://forum.babylonjs.com/t/changing-the-increments-of-camera-movement-when-using-the-keyboard/22344/8 "2021-07-15T10:14:53Z")

</div>

Hello and thanks for all the info.

> [@sebavan](#):
>
> Your main issue is that you animate camera but in your importMesh function you are actually creating another camera with createDefaultLightOrCamera.

That happens when one copy and pastes in a hurry … 🙄

After I fixed it, the animation works.  
So I tried to recreate the movement that happens when one uses the keyboard right arrow key ( rotation along the x-axis ) with the following code:

```auto
let pos = camera.position.clone()
pos.x+= 2;
BABYLON.Animation.CreateAndStartAnimation("cameraAnimationX", camera, "position", 1, 1, camera.position, pos, 0);

```

However that does not produce my intended results.  
See here:

> **[Babylon.js Playground](https://playground.babylonjs.com/#R2PXZA%237)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes

Maybe I should just copy what I find in the source for the keyboard input?

> [@PolygonalSun](#):
>
> Just as an FYI, if you use the default camera controls and want to adjust the speed of camera movements, you can reference the keyboard inputs directly and modify the `angularSpeed`

Thanks. Well, I intentionally do not want to use the keyboard controls.  
I need to recreate the same functionality with on-screen buttons.  
The final application will run on a touch-device with limited capabilities.

Edit:  
I am sorry but I guess mixing two different questions is a bit confusing.  
Edit 2:  
So I did check the source and the simple solution is just:

```auto
camera.inertialAlphaOffset += 0.01;

```

as seen here:

> **[Babylon.js Playground](https://playground.babylonjs.com/#R2PXZA%238)**
>
> Babylon.js playground is a live editor for Babylon.js WebGL 3D scenes