I've worked through this video twice and love it. It took me a bit to get my head wrapped up around lerp concept. Thank you, Radu! Great video and excellent tutorial as always.
This is pretty cool. I will try and learn from this and apply it to your "Animating a Plane on a Path with JavaScript | Live Coding on a Plane!" tutorial, to fill in large gaps if the mouse is moved quickly so that the point moves smoothly.
Cool!! But... I might have done that already. Check that plane on the path tutorial again, in the part where I smooth the path... I don't remember 100%, though :-)
for anyone confused on why we are subtracting a frm b, its to get the length from b to a, this is bcos our lines(a and b) both start from the same point so we don't know the length or distance btw a and b so to do so we subtract a frm b and then we can effectively get any position in between my scaling that length down using multiplication(scales down bcos we are using a fraction)
Glad you like it :-) Actually... something I forgot to mention is that the web audio API has built-in functions for doing interpolation, like the linearRampToValueAtTime(val, time). Might be useful to know if you plan to play around with things like this.
Great to hear! It's not a hard formula, but my students often implement it hundreds of times in their code bases... instead of implementing it once and using it where needed. This often leads to bugs and hard to read code.
Hi Radu, Could you please explain how third of the way required dividing it 3 times. Why do we need to add the distance to A 3 times.The part where in you dervied with the formula wasn't clear to me.
Can you be more specific and give a timestamp, so I know exactly where you have trouble understanding? The way I like to think of it is the difference between b and a is the thing that is scaled, so, if we take a third of that and add it to a, we move one third away from a... Maybe this helps.
Too much trouble :-) and... when I made my self-driving car course, I did it with Udemy in mind as well. I made some assignments and special segments for those. Then, few days before I was ready they limited the duration of free content to something (maybe 2 hours, or so). My course was longer so, I had to give up on it :-/ Less views are a good thing too :-) like, I can find the time to answer to your comment!
Use the style that matches the existing code-base... Otherwise, if starting a new project, pick the one that you prefer / are the most comfortable with.
My cat was asleep in front of my laptop. As soon as the sound started interpolating he turned his and looked at the screen with a WTF is that look on his face!
@@Radu I just did sound and figured out how to 'turn it off', as in I changed the 'volume' to zero when I clicked again and then returned the value to 0.05 (instead of 0.1) when I clicked again
Great video! Thanks for the simple explanation of the concept! 14:54: shouldn't it be like 33% because you divide the distance between A and B into nine parts?
Yes. By default, the IDs of all items in the DOM become global variables accessible in JavaScript. I don't really recommend this practice, because sometimes they can get overwritten by mistake, but for small projects it is ok (especially if you're the only one working on it).
I might, but the video I point to somewhere in the middle (Beauty of Bezier Curves) does a fantastic job explaining them. After seeing it, I don't see the point in making anything remotely similar...
@@davidmurphy563 Well, I think doing the same thing again is just a waste of time. But I would have something small to add to that video: It didn't demonstrate a way of getting equally spaced points along the curve (just mentioned it). A few months ago I coded a simple 'train simulation' while on a train :-) and I had a solution to that problem. I will do a quick video about it one of these days.
@@Radu Oh, that sounds really interesting. Do you ever feel a little disheartened when you hear a fantastic explanation but it's about something you already know? Maybe it's just me but there's nothing like learning something new.
@@davidmurphy563 People often add their 'personal touch' to whatever it is they teach. I often watch things I already know to see their approach. I pay attention to the presentation, the choice of words, visuals etc. I feel I get a better understanding of the topic like that, even if I am quite comfortable with it already.
How are you able to target the canvas element by its id without 'getElementById' or other DOM method? I meen, how long has this been possible? Is it a browser feature or part of the javascript standard now?
IDs in HTML automatically become global variables in JavaScript... I use it sometimes to 'get to the point' and keep the tutorial short, but it's not something I recommend... It's easy to overwrite such variables by mistake and crazy things can happen :-P
I guess it's because I don't polish the things I do so much. Maybe I should... But I feel making proof of concepts is enough, and you guys can use the ideas in other things. Let's see... I am planning to build some larger software projects in the future and I might use some existing GUI or even make my own.
Explanation for adding anything in middle or any point between of 2 co-ordinate is superb (const C) in p5.js we have a translate() function to solve this scenario.
I tried p5.js once :-) I think I encountered it that time. HTML Canvas also has a translate method, but I only use it if I need to rotate as well (and am lazy to do the math).
I had a senior moment and didn't realise that lastPath was grabbing a reference to the actual array. Once I figured it out I removed my comment to avoid potential confusion.
Good job! Thanks for teach this. I create videos too. If you care for opinions, I think the experience would be a little bit better if you were to shorten the intro a bit by cutting down from 2 comedic clips and only using one. I had a moment there where I was enjoying it and then had to hit the skip button about 4 times. All the best, Adrien.
Thanks for the tips! You mean choose between the joke before the intro song and the intro song itself? I also think the intro takes too much time. I wanted to add chapters, but I guess I forgot. I'll do it today.
Argggg, is it noticeable? Using different equipment and audio and video are not in sync. I did try to fix it, but the difference is not the same everywhere :-| I recorded 5 videos in the same day so, hope they are not going to be too pissing off :-))
Please like this video so I know if I should make more content like this :-)
Keep it please
:-)
Yes sir.
Please do more! You really inspire me to up my math and JS knowledge with your content! I only wish I was able to take your class from the US!
@@philipreynolds5088 Thanks for watching. Might be possible to take remote classes in the future, let's see :-)
I've worked through this video twice and love it. It took me a bit to get my head wrapped up around lerp concept. Thank you, Radu! Great video and excellent tutorial as always.
I'm really happy to hear you got something out of it! Thanks for watching :-)
best programming channel in the world , explained it like a charm
Glad it helped :-)
This is pretty cool. I will try and learn from this and apply it to your "Animating a Plane on a Path with JavaScript | Live Coding on a Plane!" tutorial, to fill in large gaps if the mouse is moved quickly so that the point moves smoothly.
Cool!! But... I might have done that already. Check that plane on the path tutorial again, in the part where I smooth the path... I don't remember 100%, though :-)
@@Radu Hi, you have but I want to try and implement it myself by learning LERP. Thanks
Sure :-) -
for anyone confused on why we are subtracting a frm b, its to get the length from b to a, this is bcos our lines(a and b) both start from the same point so we don't know the length or distance btw a and b so to do so we subtract a frm b and then we can effectively get any position in between my scaling that length down using multiplication(scales down bcos we are using a fraction)
Thanks for the explanation! :-)
Please continue teaching math using such examples. I'd love to see more of these.
Probably I will someday :-) thanks for watching!
I love you teaching math Radu. keep it up!
Happy to hear :-)
I've done my Linear Interpolation Project using NextJS and it's improve my skill significantly
Wow, cool :-)
Lerp is awesome... One of my favorite utils!
Same here :-)
Btw, you commented something on one of my other videos, but youtube removed it... Sometimes it does that :-(
Gr8 as always!
I am glad to find your channel in my 3rd year of college
Thanks :-) hope it helps with your studies.
Really really underrated
Thanks :-)
Wow. Sound in web. This is Nice bonus!
Glad you like it :-) Actually... something I forgot to mention is that the web audio API has built-in functions for doing interpolation, like the linearRampToValueAtTime(val, time). Might be useful to know if you plan to play around with things like this.
Great content again!!! I love how you use programming techniques and math togethers!
Thanks for watching :-)
UNDERATED. THE GOAT.
:-) thank you
this video is awesome, want more videos on mathematical functions
Ok. I'll try to make more.
Sir
Your explanation is very good and crystal clear 👍
Thank you!
you can press "alt z" in vscode to enable word wrap so you dont have to worry about code fitting in the screen
But then it goes on the next line in an ugly way :-))
Hi Radu! I learned of the linear interpolation formula from your car tutorial. It really helped me with a project I'm currently working on!
Great to hear!
It's not a hard formula, but my students often implement it hundreds of times in their code bases... instead of implementing it once and using it where needed. This often leads to bugs and hard to read code.
@@Radu Where can we see how this happens?
@@KrumSavov hi, not sure what your question is.
I've actually caught myself humming the "Coding with Radu" theme song at times.
Glad you like it :-) It's funny how mixed feelings I get about it from people :-D
Hi Radu, Could you please explain how third of the way required dividing it 3 times. Why do we need to add the distance to A 3 times.The part where in you dervied with the formula wasn't clear to me.
Can you be more specific and give a timestamp, so I know exactly where you have trouble understanding? The way I like to think of it is the difference between b and a is the thing that is scaled, so, if we take a third of that and add it to a, we move one third away from a... Maybe this helps.
@@Raduthank you, that made it clear. Now i understood
Why so less views, please start teaching on udemy too and other platforms, you are amazing.
Too much trouble :-) and... when I made my self-driving car course, I did it with Udemy in mind as well. I made some assignments and special segments for those. Then, few days before I was ready they limited the duration of free content to something (maybe 2 hours, or so). My course was longer so, I had to give up on it :-/
Less views are a good thing too :-) like, I can find the time to answer to your comment!
best intro song in the universe :D
Haha :-) You know there's an extended version on my channel?
nice video man.i enjoyed it a lot.
Cool!
You should make more content like this ;-) Absolute fav coding content maker. Stay C#
I'll try :-) Thanks for watching!
great teacher
Thank you :-)
Great video. Thoughts on inheritance vs composition and factory functions?
Use the style that matches the existing code-base... Otherwise, if starting a new project, pick the one that you prefer / are the most comfortable with.
bro, after this sick intro I gotta subscribe!
It's like there are two groups:
A: man, I would subscribe but that intro... sorry
B: That intro is great! Subscribed
Guess you're in group B :-D
Hi ,sir how are you ,Iam from india. Iam your big fan.❤❤💖💖💝💝
Cool :-) Welcome to the channel!
This is amazing. Thank you
You're welcome!
My cat was asleep in front of my laptop. As soon as the sound started interpolating he turned his and looked at the screen with a WTF is that look on his face!
Haha :-D would have liked to see that!
I finally worked on my homework again and got as far as interpolating color last night; I'll get sound tonight
Awesome!
@@Radu I just did sound and figured out how to 'turn it off', as in I changed the 'volume' to zero when I clicked again and then returned the value to 0.05 (instead of 0.1) when I clicked again
Cool
Kiitos!! Great vid!
Glad you liked it :-)
Great video! Thanks for the simple explanation of the concept!
14:54: shouldn't it be like 33% because you divide the distance between A and B into nine parts?
You're right :-) Guess I counted wrong. Thanks for pointing out!
U r the best
:-)
Can you explain how myCanvas variable works even you are not getting it from the DOM please?
thanks for the content very informative
Yes. By default, the IDs of all items in the DOM become global variables accessible in JavaScript. I don't really recommend this practice, because sometimes they can get overwritten by mistake, but for small projects it is ok (especially if you're the only one working on it).
@@Radu Oh that's very cool, thank you for taking time to reply
@@sudoCss No problem :-)
That was new to me too, nice question
Oh, you can maybe build on this and do cubic interpolation. That's always fun. Especially when you join lines.
I might, but the video I point to somewhere in the middle (Beauty of Bezier Curves) does a fantastic job explaining them. After seeing it, I don't see the point in making anything remotely similar...
@@Radu Fair enough, it can be tricky making videos when there are some outstanding ones out there already.
@@davidmurphy563 Well, I think doing the same thing again is just a waste of time. But I would have something small to add to that video: It didn't demonstrate a way of getting equally spaced points along the curve (just mentioned it). A few months ago I coded a simple 'train simulation' while on a train :-) and I had a solution to that problem. I will do a quick video about it one of these days.
@@Radu Oh, that sounds really interesting. Do you ever feel a little disheartened when you hear a fantastic explanation but it's about something you already know? Maybe it's just me but there's nothing like learning something new.
@@davidmurphy563 People often add their 'personal touch' to whatever it is they teach. I often watch things I already know to see their approach. I pay attention to the presentation, the choice of words, visuals etc. I feel I get a better understanding of the topic like that, even if I am quite comfortable with it already.
excellent
Thanks!
@@Radu u put alot of work ,I really appreciate it
How are you able to target the canvas element by its id without 'getElementById' or other DOM method? I meen, how long has this been possible? Is it a browser feature or part of the javascript standard now?
IDs in HTML automatically become global variables in JavaScript...
I use it sometimes to 'get to the point' and keep the tutorial short, but it's not something I recommend... It's easy to overwrite such variables by mistake and crazy things can happen :-P
Awesome, thanks Radu :)@@Radu
How you configuring your image to be like a reproduction?. A video about it?. Great topics in your channel, congrats
I don't understand your question. You mean how I do the filming?
Why in your tutorials you never use some GUI like tweakpane to make more visual the explaination. Just get that as an idea pls
I guess it's because I don't polish the things I do so much. Maybe I should... But I feel making proof of concepts is enough, and you guys can use the ideas in other things. Let's see... I am planning to build some larger software projects in the future and I might use some existing GUI or even make my own.
@@Radu +1
thanks, can we get more of those videos? there is a need for good math videos for cs
I will try :-)
1:08 I understood that reference
(`○ д○´)✧
Nice hair cut!
Haha, thanks :-) but it will grow back.
Explanation for adding anything in middle or any point between of 2 co-ordinate is superb (const C) in p5.js we have a translate() function to solve this scenario.
I tried p5.js once :-) I think I encountered it that time.
HTML Canvas also has a translate method, but I only use it if I need to rotate as well (and am lazy to do the math).
Thanks!
Thank you!
You asked something about lastPath in another comment. Did you remove it or did RUclips delete it?
I had a senior moment and didn't realise that lastPath was grabbing a reference to the actual array. Once I figured it out I removed my comment to avoid potential confusion.
@@nickeax I thought so :-) But sometimes RUclips works in mysterious ways... like I can still see your deleted comment in the notifications.
Good job! Thanks for teach this. I create videos too. If you care for opinions, I think the experience would be a little bit better if you were to shorten the intro a bit by cutting down from 2 comedic clips and only using one. I had a moment there where I was enjoying it and then had to hit the skip button about 4 times. All the best, Adrien.
Thanks for the tips! You mean choose between the joke before the intro song and the intro song itself? I also think the intro takes too much time. I wanted to add chapters, but I guess I forgot. I'll do it today.
🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥🔥
🧯🧯🧯🧯🧯🧯🧯🧯🧯🧯🧯🧯🧯🧯🧯
I love your stuff, but n-1 is an error and it's driving me crazy!!! 8-P
n-1?
Goes from .0 to .9 instead of 1.0
@@vincentcleaver1925Ah yes, you're right! I think someone else pointed out the mistake a while ago but I forgot it was there :-)
@@Radu I 'had' to, sorry to criticize, but it gets on my OCD! 8-P
Gonna code this in my blog, dirty all in html copy and paste into the blog
In my lazy way I've been slowly working on the basics-
vincesalienzoo.blogspot.com/2023/11/lerp.html?m=0
Night crwom
:-)
Am I the only one who is seeing lag in audio?
Argggg, is it noticeable? Using different equipment and audio and video are not in sync. I did try to fix it, but the difference is not the same everywhere :-| I recorded 5 videos in the same day so, hope they are not going to be too pissing off :-))