Camera animation from one vector point to another

Questions
1

Hello, I’m looking for some help on how to animate an Arc camera from one vector point to another. Right now, when the user clicks the directional button, the camera should move in the direction that they pointed. So I currently have a vector3 that has the current camera points, then the destination vector points. I want to animate it so that the camera smoothly moves from the current point to the destination point.

I’ve tried:
let easing = new QuadraticEase()
easing.setEasingMode(EasingFunction.EASINGMODE_EASEIN)
Animation.CreateAndStartAnimation(
“slideIn”,
camera,
“position”,
30,
60,
current,
destination,
0,
easing,
callback
)

and also:
let animationcamera = new BABYLON.Animation(
“myAnimationcamera”,
“position”,
60,
BABYLON.Animation.ANIMATIONTYPE_VECTOR3,
);

let keys = [
  {
    frame: 0,
    value: current,
    outTangent: new BABYLON.Vector3(0.1,0.1,0)
  },
  {
    frame: 30,
    value: destination,
    inTangent: new BABYLON.Vector3(0.1,0.1,0)
  }
];

animationcamera.setKeys(keys)
camera.animations = []
camera.animations.push(animationcamera)

scene.beginAnimation(camera, 0, 30, false, 0.2)

The issue is always that the camera “snaps” into place and doesn’t smoothly move from one spot to the other. Please help! Thanks!

2

@rita1097 please check out this post and PG example from @Wingnut, although the correct PG link is https://www.babylonjs-playground.com/#UTINNB#6

3

Thanks for your reply. Unfortunately, that link won’t work for me :frowning: it is not loading the page

4

Colon got mixed in with the url should be https://www.babylonjs-playground.com/#UTINNB#6

Alternative, clicked on grey box becomes camera position https://www.babylonjs-playground.com/#DXE1CV#1

1 Like
5

Oops, sorry. Fixed.