Processing / p5.js Tutorial: What is lerp? (Linear Interpolation)

Learn Processing from scratch:

Help us caption & translate this video!

[SowedCastelli]

I like your positive energy Mr. You can not not enjoy these lectures. Thank you for the vids. So on point.

[ladydie]

It‘s amazing how easily understandable lerp is, when you think about „teleportation Dan“ vs. moving Dan. Another great tutorial - you‘re such a great teacher. Have some (sadly only digital) cherries as a sign of my gratitude for all this outstanding educational content that you’re providing! 🍒🍒🍒

[RossHvidsten]

i dunno if it's in part because i have ADHD but i'm relieved every time i come across one of this guys videos... like i actually want to listen to what he's saying and it actually goes in properly without having to cry blood in the process 10/10.

[HowtodoITvideos]

love the way you are enjoying yourself while

[singletonpattern]

thank you very much, very clear and focused explanation, good work

[rahuldotel]

wow so easy to understand . best teacher ....

[sairaj]

Wow! Thank you Daniel. This was really nice :)

[dlvkifl]

hey dave your tutorials are great. can you make a short video in curve interpolation in p5. i will be so helpful.

[burhanahmad]

thank you, this was fun to learn, P.s. I feel like your zeroes are staring at me constantly

[muhammadrizvi]

Thanks for sharing this video. I have a question, Currently I'm working on Data Compression and Reconstruction techniques. I was given 20, 000 data points and I compressed it into 244 data points through Linear Interpolation. Now I want to reconstruct the data again but I'm stuck that how to implement the Linear Interpolation to reconstruct the data again to 20, 000 data points.
I will be waiting for your kind reply.
Regards

[timmellis]

Hello, do you know if createLinearGradient works with P5? I'm new to programming but I can't get the code I wrote before using P5 to work with my P5 set up, like createLinearGradient for example. Also why do you have the greyed-out word void in your code? -- Thank you anyone who wants to answer. I'm totally lost

[RicardoGarcia-mmfo]

Isnt this like the same a zenos paradox? Does x ever equal targetx? I can imagine x getting very close to x but the difference will still be real. Is there a point in the lerp function where it just sets the value of x to targetx??

[WalksWithBooks]

Would this make more sense for a drop in place code instead of example (I'm thinking physics engines).
vector normal = lerp(Start(or maybe velocity), Destination(or maybe direction), TimeToExecuteForces);

[khaledsanny]

is that how path finding work in 2d games ? when the ennemi follows the player ? when reaching a radius start attacking ?

[moonrose]

@The Coding Train


 lerp(x, x0, x1, fx0, fx1) \
(fx0) + ((fx1) - (fx0))*((x) - (x0))/((x1) - (x0))


What does the bottom row mean? It looks like this Lerp is taking more than 3 arguments, what are all the extra arguments?

[DragonLegendOnline]

The side effect of how you are using lerp results in a slow down during the last moments. This is simply because you are updating the start point with the newly interpolated position. If it is intended, then you achieved what you are trying to accomplish, however, I don't think you want that as it's ugly. The right way to smoothly linearly interpolate an object between start and destination is to never replace the start position with the new interpolated value but rather use the interpolate value to update the position of the object between the start and finish.

[brendanjames]

Hey Daniel,
I'm wondering if lerp is the way to go if I want to do a smooth zoom? I have a sketch setup where I click and the image zooms in but it's a snap not a smooth zoom. Is lerp the way to go?

[KennyFully]

What happens is value 1 is greater than value 2!?

[MarianoFrancisco]

Hello Dan

why in this Processing code "x" never gets "400" value, always is "391"?
Thanks in advance.


int x = 100;

void setup() {
size(500, 500);
background(0);
}

void draw() {
background(0);
fill(255);
x = int(lerp(x, 400, 0.1));
println(x);
ellipse(x, 250, 30, 30);
if (mousePressed) {
x = 100;
};
}

[writethatdown]

I noticed that in your toolbar, you don't have the recording symbol on it. How is that possible? Whenever I try to record something it shows up, is there any way to hide it?