DirectionalRotation not working properly with object (x,y)

[Richacinas]

Hi there,

I'm using directionalRotation plugin, in order to tween an object with x and y properties (radians) that I want to use to set my rotation in the onUpdate function. Here is some code:

let cameraLookatTransition = {
        x: cameraLookat.x,
        y: cameraLookat.y
      };

      let cameraActualLookat = {
        x: this.controls.getPolarAngle(),
        y: this.controls.getAzimuthalAngle()
      };

let actualTween = new TWEEN.Tween(cameraActualLookat)
      .to(cameraLookatTransition, this.easingDuration, {directionalRotation:{x: (cameraLookatTransition.x + "_short"), y: (cameraLookatTransition.y + "_short"), useRadians:true}})
      .onUpdate(function(actualLookAt) {

        controls.setRotation(this.x, this.y);

      })
      .easing(TWEEN.Easing.Sinusoidal.Out)
      .start();

However, it is giving me weird values, causing my camera to start from a bad rotation point when I have to go from negative to positive values on any axis, or viceversa.

Any idea? is there any problem with the way I'm trying to do this?

Thanks a lot,

Ricardo

[Richacinas]

Here a screenshot of some console.logs that I have in my code. You can see the starting points and how it goes the longest way instead of shortest (Y axis).

[jackdoyle]

Hi @Richacinas - I don't see any GSAP code in that demo. It appears as though you're using TWEEN.Tween() which I'm guessing is an entirely different animation engine. Right? Am I missing the GSAP code somewhere?

[Richacinas]

My apologies.. I made a mistake and the library I was using was the one you mention without realizing it!

Now I'm using gsap and the directional rotation works great.

Thanks a lot and sorry about that

[jackdoyle]

No problem at all. Happy tweening!