Lerp: The good, the bad, and the average

Post your own tutorials, guides and demos.

Post » Wed Jul 08, 2009 2:28 pm

From the Wiki:
[quote:11n3qrvm]Lerp(a, b, x)
Linear interpolation: Calculates a + x(b - a), or linearly interpolates a to b by x%. Eg. lerp(a, b, 0.25) gives the value 25% of the way from a to b [/quote:11n3qrvm]

Basically this is a lot like the game "pick a number between 1 and 10".
Except for here we are using a percent, so our x, or number we are picking must be expressed as a float. IE 50% would be 0.5, and 25% would be 0.25. In which case our return value would be 5.5, and 7.75.
In case you were wondering that would be written as lerp(10, 1, 0.5).
Ok maybe not to terribly useful for that little game, but suppose you had two numbers say something like x coordinates for two different sprites. Then suppose you wanted a third sprite to move somewhere in between the first two sprites, lets say half way.
With lerp all we have to do to find the point that's in the middle of the two is use the expression like this:
[code:11n3qrvm]lerp(sprite1.x, sprite2.x, 0.5)[/code:11n3qrvm]
Of course you might want to find a y value as well:
[code:11n3qrvm]lerp(sprite1.y, sprite2.y, 0.5)[/code:11n3qrvm]

Ok in this example half the way was shown with 0.5, so if we wanted to go 1/4 of the way we would use 0.25, and if we wanted to go 75% of the way we would use 0.75 etc.

Now lets put that together. We have 3 sprites, sprite1, sprite 2, and sprite3. Sprite one is on the left side of the layout, and sprite 2 is on the right side. Then sprite 3 you can place anywhere.
With a simple trigger the event might look something like this:
[code:11n3qrvm]MouseKeyboard: On Left Clicked on Sprite3
> Sprite3Set position to lerp(Sprite1.X, Sprite2 .X,0.5), lerp(Sprite1.Y, Sprite2.Y,0.5)[/code:11n3qrvm]

Alright now for the next example lets say we want a smooth transition when sprite 3 moves. We can use lerp for this as well. Note since this would be a continuous action you will need some kind of always event, along with the trigger. I'll use mouse is down.

[code:11n3qrvm]MouseKeyboard: Left mouse button is down
> Sprite3Set position to lerp(Sprite3.X, lerp(Sprite1.X, Sprite2.X, 0.5),1 - 0.05^TimeDelta), lerp(Sprite3.y, lerp(Sprite.y, Sprite2.y, 0.5),1 - 0.05^TimeDelta)[/code:11n3qrvm]

Wait... wut?
To simplify this we have a lerp within a lerp with the first lerp's numbers, or a, and b are our current x,y, and target x,y, then the x could be thought of a step. We use timedelta to make sure there is no frame skip.
The current x,y is expressed as sprite3.x, and sprite3.y since the sprite is always moving while the mouse is down. Then the target x,y, our second lerp, is written like our original example lerp(Sprite1.X, Sprite2.X, 0.5). Finally the step is expressed as 1 - 0.05^TimeDelta. Basically we are moving a tiny percent of the way each tick.

More coming soon.
Image Image
B
161
S
48
G
90
Posts: 7,347
Reputation: 66,749

Post » Thu Jul 09, 2009 12:37 am

Thanks for the great tutorial newt! Very easy to understand.
B
2
G
3
Posts: 27
Reputation: 904

Post » Thu Jul 09, 2009 2:28 am

Thanks Newt, it makes sense now.
Maybe you could upload a .cap as well?
B
134
S
65
G
16
Posts: 1,765
Reputation: 19,188

Post » Thu Jul 09, 2009 6:26 am

Ok here's an example cap with a little something extra.
See if you can figure out how it works. :?: :wink:
[url:2lw8f3mv]http://files.getdropbox.com/u/666516/lerpexamples.cap[/url:2lw8f3mv]
Image Image
B
161
S
48
G
90
Posts: 7,347
Reputation: 66,749

Post » Thu Jul 09, 2009 9:34 am

Thank you for posting this, I hope more people use lerp now :).
B
3
S
2
G
5
Posts: 1,777
Reputation: 5,529

Post » Thu Jul 09, 2009 10:22 am

Question: how fast is lerp compared to custom expressions?

Say lerp(x1,x2,0.5) compared to (x1+x2)/2
B
62
S
21
G
12
Posts: 1,910
Reputation: 13,155

Post » Thu Jul 09, 2009 7:50 pm

[quote="Mipey":2cyjrcgp]Question: how fast is lerp compared to custom expressions?

Say lerp(x1,x2,0.5) compared to (x1+x2)/2[/quote:2cyjrcgp]

the standard equation for linear interpolation I'm assuming they are using would be
P0+(t*(P1-P0))

or in this example
x1+(0.5*(x2-x1))

I would say the speed difference, if any, would be negligible since consumer grade cpu speeds now days are measured in billions of floating operations per second. it's worth the time you would save, using such a logical and easy to understand expression, and it makes it that much easier when you're ready to graduate to qerp, and cubic
Spriter Dev
B
87
S
21
G
12
Posts: 3,240
Reputation: 16,461

Post » Thu Jul 09, 2009 10:07 pm

[quote="Mipey":27jmhth8]Question: how fast is lerp compared to custom expressions?

Say lerp(x1,x2,0.5) compared to (x1+x2)/2[/quote:27jmhth8]
Both probably execute so quickly as to be unmeasurable. That's like weighing a mountain and worrying about the effect of adding a grain of sand. Expressions typically execute extremely quickly. Worry about the rendering speed instead. See the 'optimisation tips' article for info on that.
Scirra Founder
B
359
S
214
G
72
Posts: 22,946
Reputation: 178,528

Post » Fri Jul 10, 2009 7:30 am

Yeah, well, in my case the CPU is a bottleneck; I tend to go overboard on "the cogs" so to speak. ;)
B
62
S
21
G
12
Posts: 1,910
Reputation: 13,155

Post » Fri Jul 10, 2009 6:57 pm

[quote="Mipey":2uogyqvd]Yeah, well, in my case the CPU is a bottleneck[/quote:2uogyqvd]
Heh, my game also. With really small resolutions, games tend to bottleneck at the CPU, since everything is being rendered so fast. Some events have considerable overhead, namely overlapping at offset.
B
25
S
3
G
6
Posts: 1,197
Reputation: 5,620

Next

Return to Your tutorials & example files

Who is online

Users browsing this forum: No registered users and 0 guests