Center Dot Cursor Arrow Pointer

macwanna · June 17, 2025, 6:58am

I was trying to create a basic arrow cursor that can be present around the centre dot, rotates around the center 360° in a 2D (X & Y) scape (basically screen UI), while pointing towards the highlighted objective in a 3D environment. This environment is full 3D with X, Y and Z axis movement. The player can move and rotate in all directions.

The end goal is to make the arrow below rotate towards the highlighted objective. Right now it rotates, just not towards what I want it to rotate to.

Solution 1 (this one comes really close):
The logic in this one is → I get the location (Vector) of the spawned objective and pass it into the WB of the Screen UI. This is where the calculations happen inside a timer (not using event tick for this). I have a separate WB just for the arrow, which is an image inside a canvas.
In a custom event in the WB Screen UI Event Graph, I just create the WB Arrow and add it to the Screen UI canvas as a child, and then do some technical changes to the arrow like setting anchors, alignment, position and render transform pivot, and then the timer (Set to 0.01 seconds and looping, so frame by frame) starts.
This is where I need help understanding the math and logic of how it should be done:

Initially in the calculations, I get the World location of the player (I am using a pawn here), and subtract that from the ‘vector’ of the spawned objective (yellow line coming in from top) then I make a Vector 2D out of the X and Y and normalize 2D. Same for the camera component in the bottom part.

Then the values are fed into ‘dot’ and broken and multiplied with each other and then subtracted from each other (I don’t get this part, maybe this math is wrong), Atan2 (Radians) and then turned into degrees, which I feed into set render transform angle for the Arrow (got the formula from GPT)
While debugging one by one, I checked that the vectors I was getting were correct, and the end debugging was checking the Degrees, which would always be zero on the spawned objective (so that was mission success kinda), but the arrow would end up not pointing towards the objective. It would instead point upwards on the Z axis (there is a Z axis point where all degrees are present, 180° to 0° to -180°)
So I am not sure how to go about this

Solution 2:
This one is logic where the location of the spawned objective is measured against the Screen UI using ‘Project world location to widget position’.
I don’t know how this one should work, so have put a basic version of whatever I last had, here

If anyone knows a better method do let me know.
Thanks!!

Kotaru_1 · June 17, 2025, 1:50pm

Some of the goal is a little unclear.

What I’m gathering is that you want a 2D arrow to point to a point on only the 3D x/y plane.

I’m making a few assumptions on how you want this to work, but this is most likely what you are looking for.

Atan2 gives the COUNTER CLOCKWISE rotation of a vector FROM THE X AXIS. Since its counter clockwise, we negate it. My Arrow points upwards, meaning its pointing at the y axis. To counter this, I offset by 90 degrees at the end.

This code allows makes the arrow to point at the world direction from our player to our objective as demonstrated below.

But this fails to account for the camera rotation, which in this case would be desired. So here’s how we account for it

We simply add the inverse of our camera’s yaw. Easy peasy

And here are the results

Now in this scenario, the location is relative to the player, while the rotation is relative to the camera. So in a couple instances it looks a little off, so depending on you preference, you may want to get the location from the camera instead.

macwanna · June 18, 2025, 9:09am

Thank you for the simpler system, it helped me understand better.
It still didn’t work though. I tried playing with changing some variables and stuff.

The ‘objective’ can spawn in different coordinates on X, Y and Z. And the movement of the BP_Player is also in all directions X, Y and Z. Kind of like a space game like elite dangerous. But the UI Arrow is in 2D only, and it rotates around the center dot on the screen only while pointing in the general direction of the objective.
I think I am not taking into account some axis’s or something? Or I have to use all axis’s somehow?

Kotaru_1 · June 18, 2025, 2:25pm

Okay I think I understand what you’re saying is you want it to orbit around a center point? In which case, you should be able to do the same thing, but take advantage of the hierarchy system by rotating a parent placed at the center of where you want the image to rotate around.

If that isn’t what you mean, maybe provide a clip or a screenshot of what it is exactly that you’re trying to achieve

Kotaru_1 · June 18, 2025, 4:13pm

Do you mean something like this?

In this case we calculate based on the camera’s y/z plane

I also rotate the parent of this image, which is an overlay, that way it rotates around the center