# Camera position animation bug

**URL:** <https://forum.babylonjs.com/t/camera-position-animation-bug/46237>\
**Category:** Bugs\
**Created:** [December 6, 2023, 9:49pm UTC](https://forum.babylonjs.com/t/camera-position-animation-bug/46237 "2023-12-06T21:49:51Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Adam\_A](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/adam_a/32/35295_2.png) [@Adam\_A](https://forum.babylonjs.com/u/Adam_A)\
**Post date:** [December 6, 2023, 9:49pm UTC](https://forum.babylonjs.com/t/camera-position-animation-bug/46237/1 "2023-12-06T21:49:51Z")

</div>

Hi, i built an app using the following code:

var northView = function() {  
var cam = scene.activeCamera;  
var targetEndPos = new BABYLON.Vector3(-200, 65, 35);  
var camEndPos = new BABYLON.Vector3(-200, 205, 0);  
var speed = 145;  
var ease = new BABYLON.CircleEase();  
ease.setEasingMode(BABYLON.EasingFunction.EASINGMODE\_EASEINOUT);  
BABYLON.Animation.CreateAndStartAnimation(‘pos’, cam, **‘position’** , speed, 220, cam.position, camEndPos, 0, ease);  
scene.activeCamera.useAutoRotationBehavior = false;  
};

Out of the blue, ‘position’ is now inactive, only ‘target’ works, why is that?

---

<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:** [December 6, 2023, 10:04pm UTC](https://forum.babylonjs.com/t/camera-position-animation-bug/46237/2 "2023-12-06T22:04:25Z")

</div>

A repro would be great but I guess your camera type does not have a property “position”

---

<div class="post-metadata">

**Author:** ![Adam\_A](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/adam_a/32/35295_2.png) [@Adam\_A](https://forum.babylonjs.com/u/Adam_A)\
**Post date:** [December 6, 2023, 10:24pm UTC](https://forum.babylonjs.com/t/camera-position-animation-bug/46237/3 "2023-12-06T22:24:25Z")

</div>

Thanks, the app worked 100% up until 2 days ago - as if the platform changed.  
Now the code is not working. But - it does work if i use ‘target’ …  
BABYLON.Animation.CreateAndStartAnimation(‘tar’, cam, ‘target’, speed, 100, cam.target, targetEndPos, 0, ease);

See below:

//HTML MENU

var buttonbox = document.createElement(‘div’);  
buttonbox.id = “buttonbox”;  
buttonbox.style.position = “absolute”;  
buttonbox.style.top = “135px”;  
buttonbox.style.left = “90%”;  
buttonbox.style.border = “none”;  
buttonbox.style.padding = “1pt”;  
buttonbox.style.paddingRight = “1pt”;  
buttonbox.style.width = “140px”;  
buttonbox.style.display = “block”;  
document.body.appendChild(buttonbox);

```
var tTag = document.createElement('div');
tTag.id = "viewsTitle";
tTag.textContent = "Select a View:";
tTag.style.textAlign = "left";
tTag.style.border = "none";
tTag.style.marginLeft = "1.5pt";
tTag.style.marginTop = "3pt";
tTag.style.marginBottom = "2pt";
tTag.style.backgroundColor = "#333333";
tTag.style.width = "120px";
tTag.style.fontSize = "0.6em";
tTag.style.color = "white";
buttonbox.appendChild(tTag);

var b3 = document.createElement('button');
b3.id = "viewsButton";
b3.textContent = "N";
b3.style.display = "block";
b3.style.width = "100%";
b3.style.fontSize = "0.7em";
buttonbox.appendChild(b3);
b3.onclick = function() {
    northView();
}

```

//NORTH VIEW ACTION

var northView = function() {  
var cam = scene.activeCamera;  
var targetEndPos = new BABYLON.Vector3(-200, 65, 35);  
var camEndPos = new BABYLON.Vector3(-200, 205, 0);  
var speed = 145;  
var ease = new BABYLON.CircleEase();  
ease.setEasingMode(BABYLON.EasingFunction.EASINGMODE\_EASEINOUT);  
BABYLON.Animation.CreateAndStartAnimation(‘pos’, cam, ‘radius’, speed, 220, cam, camEndPos, 0, ease);  
[//BABYLON.Animation.CreateAndStartAnimation](https://BABYLON.Animation.CreateAndStartAnimation)(‘tar’, cam, ‘target’, speed, 100, cam.target, targetEndPos, 0, ease);  
scene.activeCamera.useAutoRotationBehavior = false;  
};

---

<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:** [December 7, 2023, 12:13am UTC](https://forum.babylonjs.com/t/camera-position-animation-bug/46237/4 "2023-12-07T00:13:59Z")

</div>

@Evgeni_Popov might it be related to your anim changes ?

cause if it is the case the fix would be deployed tomorrow @Adam_A

---

<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:** [December 7, 2023, 12:14am UTC](https://forum.babylonjs.com/t/camera-position-animation-bug/46237/5 "2023-12-07T00:14:40Z")

</div>

So yes it is [Camera Animation bug - #6 by Juancode](https://forum.babylonjs.com/t/camera-animation-bug/46211/6) 🙂

---

<div class="post-metadata">

**Author:** ![Adam\_A](https://sea2.discourse-cdn.com/flex024/user_avatar/forum.babylonjs.com/adam_a/32/35295_2.png) [@Adam\_A](https://forum.babylonjs.com/u/Adam_A)\
**Post date:** [December 7, 2023, 1:37am UTC](https://forum.babylonjs.com/t/camera-position-animation-bug/46237/6 "2023-12-07T01:37:18Z")

</div>

I actually found a solution:

BABYLON.ArcRotateCamera.prototype.spinTo = function (whichprop, targetval, speed) {  
var ease = new BABYLON.CubicEase();  
ease.setEasingMode(BABYLON.EasingFunction.EASINGMODE\_EASEINOUT);  
BABYLON.Animation.CreateAndStartAnimation(‘’,  
this,  
whichprop,  
speed,  
120,  
this[whichprop],  
targetval,  
BABYLON.Animation.ANIMATIONLOOPMODE\_CONSTANT,  
ease);  
};

```
var northView = function() {

//camera.spinTo("target", new BABYLON.Vector3(0,0,0), 60);
    camera.spinTo("alpha", 8, 120 );
    camera.spinTo("beta", 2, 120 );
    camera.spinTo("radius", -60, 120);
    camera.spinTo("target", new BABYLON.Vector3(0,3,0), 120);
    scene.activeCamera.useAutoRotationBehavior = false;
};

```