How can I have an animation for camera when change the set target?

Questions
1

Hello everyone

In my model there is the height map, and it can get any position on map as a camera target (with the aid of double click on it). but when I want to set a new target the camera suddenly change the position, how can i make an animation for moving the camera?

here is my PG: https://playground.babylonjs.com/#XB49NT#9

2

use GSAP ( greensock animation package ) the best javascript interpolation/tweening engine out there

1 Like
3

Hi @shaderbytes
Thank you so much for answering to my question.

is it possible to use this engine for camera animation in babylonJS?

4

it is javascript and can interpolate any javascript value :wink:

just understand what interpolation is first , it is simply taking a start value and changing it to a end value over time. how it changes this value over time is pushed through a special function known as “easing”

Linear easing means a stead constant movement. “ease in” means starts slow and speeds up, they have many different easing functions to choose from.

1 Like
5

Thank you so much for your helping, I am going to learn about it and use it. :pray: :pray:

6

here is a working version of your playground just to show you :

https://playground.babylonjs.com/#XB49NT#10

Small set up to import the CDN in the playground and wait for it to load for use , wont be the same in production code , anyay to the point that matters this one line :

gsap.to(camera.target,1,{x:evt.pickInfo.pickedPoint.x,y:evt.pickInfo.pickedPoint.y,z:evt.pickInfo.pickedPoint.z})

4 Likes
7

OMG, its great. Thanks a lot. its so goood. :pray: :pray: :pray:
Thank you so so much.

8

Hahaha! @Arash_Bagheri That’s pretty much how I feel every time I ask question on this forum! Amazing library backed by amazing community!

3 Likes