5.7 Path Following (Steering) - Nature of Code

in this video i am going to implement the steering behavior path following this will depend entirely on everything that i did in the previous video on scalar projection i'm just going to bring that code over here so you don't necessarily need to go back and watch that but if you want to understand that concept you can go back and watch the previous video i'm starting with the vehicle class that i had at the end of the arrival video the first thing i want to do is define a path for the vehicle to follow eventually i'm going to want a more sophisticated path but i think an easy way for me to begin is just have it be a path be a line that connects two points a starting point and an ending point then i can write a show function which will render that line got to make sure i add path.js to index.html i've made it this dot error it's just something i will never stop doing and so now i have a vehicle and i have a path just to make things sort of visually very simple right now my path is just a horizontal line bisecting the canvas assuming i'm going to follow the model that i developed for the previous steering behavior examples i then need to call a function to calculate a force and then apply that force this tells me i need a new function in the vehicle class itself called follow that receives a path object now in theory this is the only place remaining where i need to write code i need to read up on what the path following algorithm is and implement it into that function returning a steering vector at the end i would encourage you to pause and read the description of path following from craig reynolds paper but i'm going to describe it in my own words over on the whiteboard here's a diagram of all the elements i have so far in the code one thing i haven't mentioned which is an important element is reynolds defines a radius for a path i didn't draw that perfectly this line should be directly in the center of these two dotted lines but the idea is that if the vehicle is within the radius of the path it's on the path and remember the sort of driving principle here lifelike and improvisational manner if i wanted to i could write some code that puts this triangle exactly on this line and just moves it along the line perfectly but that's not what i'm trying to do here i'm trying to get this vehicle to sort of veer around and steer and attempt to stay within the boundaries of this path therefore this idea of a radius is kind of important step one predict the future position of the vehicle so projecting out into the future if the vehicle were to continue at this velocity for some amount of time it would perhaps end up over here step two i'm just going to call this future position pause for simplicity is that future position on the path well i can plainly see here that it is not the way i would determine that is by calculating the distance between the point and the line i'll call that d this is everything that i worked out in the previous video how to do this this here this is the path radius if d is less than the radius it's on the path if it's on the path do nothing i don't need a steering force the steering force is zero assuming it's not that point is not on the path find the projection point so if d is not less than radius so yes we just go off and do nothing if no step three find this projection point i'll call that the target and guess what step four is seek did this fit onto the whiteboard it did seek that as the target we've already written the seek algorithm in a previous video so that'll make things a lot easier when we get there okay let me try to go and implement this in the code first i'd like to add a radius to the path and i'm going to make it 20 just arbitrarily and i'm going to draw another line with the thickness of the radius times 2 giving it some alpha so now we can visually see the path radius as well now there is one more interesting question i'm just thinking about which is is falling does following the path mean move this way or does it mean move this way and there's no real answer to the question it's up to you to define that and ultimately i think the way i'm going to implement it whatever its starting velocity is going to ultimately determine which way it's following the path which is why here in the sketch for now i'm hard coding an initial starting velocity step one predict the future position to do that i just make a copy of the velocity multiply it by 50 and i'm going to look 50 frames ahead and then add that to the current position and that's my prediction of the future location there's still that thick stroke weight there so let's say no stroke drawing it of course is unnecessary for the algorithm but i think it'll be helpful if i add visual annotations as we work this out step two is this future position on the path well the way i determine that is by calculating the distance and finding out if that's less than the radius how do i calculate the distance think back to my previous video scalar projection i'm going to grab this vector projection function from the previous video and remember the vector projection function the way as written takes two vectors one would be defined as a vector that points from the start of the path to the vehicle's future location that's vector a vector b is the start of the path to the end of the path the vector that defines the path itself but what do i actually have in my code i have three points this point this point and this point so i think i want to rewrite that vector projection function to take as its input these three points calculate these two vectors and then return this point here let's call these points in the function pause a and b and then i'll call these vectors v1 and v2 so v1 is a minus pause v2 is b minus pos so what was the vector b is now the vector v2 i don't need to copy it anymore because i've just made it up right here but i do need to normalize it then the scalar projection is v1 dot v2 v2 multiplied by the scalar projection to get its length and return v2 but all i really need in this case is this point so i don't actually need this vector i just need to find this point which is this position that i've started with adding that vector projection the function takes these three points the start and end of the line as well as the future position of the vehicle and returns the projected point let's call that find projection and ultimately that's going to be the target to seek if in fact we need to move on to step four i kind of made these in a slightly weird order with a little bit odd naming i might refactor this in a moment to make it more clear but it's start future end path dot start future end let's just draw that point as well oh path dot end i'll make that a different color and we can see there's that point projected onto the path what was i trying to figure out again right i need this distance i know this point that's the future i know the projected point i need to calculate the distance between those two points and find out if it's less than the radius the distance between what the future and the target if that distance is less than the path of the radius what do i do return seek that target otherwise return i don't know a vector that's got nothing in it because it do nothing is that really everything i predicted the future position i determined whether it was within the radius and then uh to determine whether i kind of wrote this in a weird order i'm realizing because in order to determine whether it's within the radius i need to find that projection point so that i can find this distance and then once i have that projection point if it's not within the radius then seek the target you got all that what's the chance that this works right i'm calling that function i'm getting the force out i'm applying it let's see what happens well that doesn't seem to be working at all let's console.log that distance see what i'm getting 100 100 100 100 100. that makes sense let's console log path dot radius oh my goodness whoops seek the target if the distance is greater than the radius oh i'm really feeling like this is going to work now oh seek is not defined this dot this dot this stop this dots [Music] it's working let me get rid of the console log let me uh s lower the maximum force and maximum speed i think i also might be looking too far ahead with this vehicle this 50 should really be a parameter of the system like how far does it look ahead but let me look less far ahead just to sort of see that's kind of fun you so you can see once it gets on the path it stays doesn't do any steering okay let's at least make the path a little wonkier like not just a perfect horizontal line and i think it actually would be fun if i could move the path with the mouse so i'm going to set the y position of the end point of the path by moving the mouse now of course the wrap around causes it to not wrap around the path but to reappear there which is kind of funny to see but you can see now this idea of attempting to follow the path now i might decide to like remove some of the annotation just to see what it looks like without that obviously i could have a variable or an interface to turn that stuff on or off let's make the canvas much wider and there we have our little vehicle trying to follow the path boy do i really want to keep going here i think i need to take a minute take a minute and breathe this is a lot just this much is a lot so i would encourage you to think about how you might incorporate this into some of some of the other examples that i've already created what happens if now you had another vehicle that's pursuing this vehicle that's following the path that could be something to try but ultimately i think where i would really like to go with this is making the path a bit more complex you might remember i think back in one of the videos i showed you the crowd path falling example which had a more complex path like this it's made up of multiple line segments how do you know which line segment to look for the projection point on you have all the tools to do this but it is a tricky problem so i'm going to leave that right now obviously i will leave a link to a solution to this in the video's description but we'll leave implementing it as an exercise to you and um you know if there's a lot of interest i can come back and add another video to this playlist where i go through augmenting the path to be something that connects multiple line segments additionally the same technique applies to wall following which is like following a path but it's a wall instead of a path as well as containment which is staying within the bounds of something so i'd like to come back and make videos on those i don't at present have examples to show you of those um but in a future future time i will or if you make your own version of it please share it with me in the comments or on the coding train uh website where there's a page that you can submit variations on this path following example hi dan here from like literally just like five minutes in the future i'm about to say goodbye but i realized after i said goodbye i missed a kind of crucial element to the entire algorithm itself and it relates back to this idea of like which way am i going on the path reynolds actually proposes that you find the projection point but that projection point isn't exactly the target that you seek rather you could look ahead from the projection point a little bit some distance on the path and maybe choose this point to seek that will sort of guarantee that you're sort of moving along in a particular direction on the path you can actually see that in this other example that i'm also including where you can see the projection point as well as a point that it's actually seeking a little bit ahead on the path of these two circles that are following this path so ultimately this is kind of another great exercise for you to try how would you have that target not be exactly where the green dot is but a little bit ahead of the path than the green dot and which way is ahead i'll make sure the code that i released with this video has that built into it and if there's a lot of questions about it i can also come back and address it in the next video that i eventually someday make about path following okay back to me saying goodbye so what's next i actually have no idea um i do want to eventually implement all of these and i've got a bunch so far but i think the real missing thing that i will at a minimum get to sooner than later is what does it mean to have groups comb and combine behaviors to some extent so what does it mean to have a separation steering behavior where uh vehicles want to separate from each other not run into each other so i want to get to that it'll lead to i have done a coding challenge with the full flocking example already so that'll be included in the playlist at the time you're watching this right now but eventually i'll be filling in some of the gaps and missing pieces with some of these other steering behaviors let me know what you think i should do next if it's not there already thanks so much for watching and see you in a future coding train video [Music] you

Channel: The Coding Train

Views: 22,428

Rating: 4.9956899 out of 5

Keywords:

Id: rlZYT-uvmGQ

Length: 15min 40sec (940 seconds)

Published: Sat Oct 16 2021