Download

Draw predicted movement path (and any spline trajectory)

These are two tutorials in one here. First we’ll learn how to find the points that the navigation system will use to move your character from one location to another. Then we’ll use those points to display the trajectory. This technique can be applied to drawing any kind of spline of course, it could be a grenade’s predicted path or anything that needs displaying a spline.

Part 1

First of all we need to find the points that the navigation system uses to reach a destination. This is done easily by using the Blueprint function Find Path to Location Synchronously. It needs a Path Start, End, a Context and a Filter. The Context can be left alone if you’re calling the function from a Pawn or a Controller. Otherwise just plug in a valid reference to either of those. The Filter Class can be left alone.

In order to get the Path Start I simply use Get Actor Location. For the Path End I call Get Hit Result Under Cursor by Channel from the Player Controller, split the result struct and use Hit Result Location. From the Return Value we can call Get Path Points. That’s all, we’ll have all the points from start to end that the character will go through to get to its destination, sorted by order.

Part 2

As an overview of what we’ll be doing first we’ll turn those points into a spline. Then we’ll use that spline to create spline meshes.

But first we need a mesh. Make a small square plane. If you want a smoother spline you’ll have to subdivide it along the X axis. That’s because the X axis is the one that will get stretched by the spline.
tut_pic_plane.PNG

Now that we have our mesh we’ll need a material for it. Make one and set it to Unlit and make sure Use With Spline Meshes is checked! Otherwise you’ll see the default gray material. Connect a glowing color to the Emissive input. Of course this is just a very basic material that barely gets the job done. You can make something a lot better for your own.

Next thing is creating the spline for the path. There’s a small gotcha here that you’ll have to understand before going further. The spline that drives the path, and the path itself are two different things. We’ll need one spline with multiple points and several spline meshes. Each spline mesh represents one segment of the whole spline. So, doing a little math you’ll see the number of segments we’re going to need equals the number of spline points minus 1.

To make the spline, follow this graph.

The reason why I’m setting the spline points to Curve Clamped is because I believe they look nicer that way.

Then we create each individual spline mesh. For more information on this method, check this out. I’m using the same method, except I’m creating both the spline and the components in the game instead of in the editor. Make sure the spline components are set to Movable and not Static.

As you can see, I’m storing both the spline and the spline components as variables. This is so that we can easily dispose of them when needed. In this case, I’m disposing of them every time I create a new path.

And this is the whole graph.

Cheers!

2 Likes

Thanks for such a fantastic tutorial! This has helped me quite a bit with a project I am working on, but I am wondering if you could help me troubleshoot an issue. Everything on my end works correctly, but the SplineMeshes do not appear in the world (or are invisible). When I debug it, I can see the arrays being created and populated, yet my meshes do not appear. Using a Debug Draw Line node shows that the start and end points are being set correctly. I know it’s difficult to help without being able to see how I’ve implemented it on my end, but would appreciate any ideas you might have.

Thank you a lot! I’m creating a tower defense game and wondered how to do that. I have bookmarked and will try your solution soon and see how it works! I’m new to game making, but I’m a senior developer otherwise, yet, I wondered, how I could figure out the path and show it, easily.

I really appreciate you sharing this and I’m usually not writing that, so I really do. For that reason, I’ll report back as soon I’ve tried this out in the next time, if there’s anything interesting to report!

@Anonymous_cd45bd7fa50f0ba0cf8a540613f93d6e

Sorry to necro such an old post but your solution has come up in many of my Google searches and is exactly what I’ve been looking for. Unfortunately, these old eyes can’t read the images. Do you have any images that are at a higher resolution?

It’s something along those lines; you’ll need to add spline mesh components, though. YT is full of related tuts but do tell if you need any help with this.

1 Like

Dude, you’re amazing. You’ve been an incredible help and I just wanted you to know how much I appreciate it.