Issue with lerp

Help & Support
1

I have issue with lerp

flyTo(dt, pointA, pointB){

    
        this.time += dt;

        let percent = this.time / this.duration;

        const position = this.entity.getPosition();

        position.lerp(pointA.getPosition(), pointB.getPosition(), percent);

        this.entity.setPosition(position);

        pointA.lookAt(this.car.getPosition());
    
    }

camera flies weirdly where go back, also when click on wheels the camera goes on the side

2

The code looks fine in isolation. Use the debugger and step through the code to double check your values and variables.

3

when I comment
// position.lerp(pointA.getPosition(), pointB.getPosition(), percent);
then the movement is ok but not smooth but the right positions

4

Not sure if this is the issue but:

Avoid changing the internal vectors the engine use. Try creating a new one somewhere in your initialize method and use that:

// in initialize
this.vec = new pc.Vec3();

// in your flyTo() method
        const position = this.vec.copy(this.entity.getPosition());

        position.lerp(pointA.getPosition(), pointB.getPosition(), percent);

        this.entity.setPosition(position);
1 Like
5

what should be wrong if it not interpolates but goes and goes above the limit value I see hmm?
for example when I pick the wheels then the percent goes above 1, so above 100%

looks like its updating over and over
this.time += dt;
but not always in other states it interpolates from point A to B

in other file I have

        if(this.isDrive){
            camera.flyTo(dt, this.cam, this.followCam);

        }
        
        if(this.isGoBack){
            camera.flyTo(dt, this.followCam, this.cam);
        }

looks also like the interpolation not works in reverse in this case
because I want to interpolate from A to B
and from B to A too

6

Do you ever reset this.time to 0 when you start a new transition?

1 Like
7

reset time in this place?

flyTo(dt, pointA, pointB){
        this.time = 0;
    
        this.time += dt;
...
}

or before calling flyTo() ?
like

this.time = 0;
flyTo();

so

if(this.camera.isFlyingToBody){
            this.time = 0;
            this.camera.flyTo(dt, this.entity, this.bodySpot);
8

Neither as they both set time to 0 before calling flyTo each frame. I don’t know what triggers the transition in the first place but if it’s on a button press, that will be where to reset values.

1 Like
9

ok yes this is on button press or when picking with framebuffer

10

also I don’t know where to reset the time in case of framebuffer picking

when I pick the body transition is smooth and finite,
but when I pick the wheels the transition looks like is infinite because it goes over 1

11

There must be some point where the app knows it has clicked on the wheels to start the transition. I would reset values there.

You may also want to clamp your lerp value between 0 and 1 too.

1 Like
12

and also I notice this
when I have

        this.camera.flyTo(dt, this.bodySpot, this.wheelsSpot);

then it not goes from body to wheels but to wheels then goes to side and goes further

13

Do you stop it when it reaches the wheelSpot?

1 Like
14

ok so I look into this thanks

15

The value of alpha, which in your case is stored in percent variable, should be from 0 to 1. When you add let percent = this.time / this.duration;, your this.time always grows, making percent grow too indefinitely, way over value of 1. This will result in camera “overshooting” the target position.

You should add a check and reset it to 1, if it is over it. Something like:

let percent = this.time / this.duration;
if (percent > 1) {
    percent = 1;
}

Also, as @yaustar mentioned, you should reset this.time to 0, before your update(dt) method on event that symbolizes the start of a lerp sequence. This will allow the percent variable to grow from 0 to 1 again.

3 Likes
16

how can I reverse lerp?
so from follow camera to camera
I try with
camera.flyTo(dt, this.followCam, this.cam);

because forward is:
camera.flyTo(dt, this.cam, this.followCam);

hmm ok so the value must go from 1 to 0