How to make a UI element point towards a Vector2 Position?

Help and Feedback Scripting Support
#1

Hey there, adventurer! Looks like you discovered an old post of mine. Feel free to read it as you wish!

Original Post

Hello there!

I’m trying to figure out how I would get a UI element to point towards a pixel-based position on the player’s viewport.

To help paint the picture better, I’m trying to have a UI element face a text-label’s position on the screen.

Anybody know the math to this?

Thanks!

1 Like
#2

Maybe the basis of 2D Raycasting can help you, then you create a line that goes from point A to point B and if here is some object between both points then the line is cuted:

Then, not say towards a Vector2 Position, Guis only uses UDim2 for Positions and Sizes, else you are using the Anchorpoint AbsolutePosition/Size properties. Or, if it is something in 2D that do something to some 3D Object, these functions maybe can helps:
https://developer.roblox.com/api-reference/function/Camera/ScreenPointToRay
https://developer.roblox.com/api-reference/function/Camera/WorldToScreenPoint

If you want to know, how to use these, then see this topic:

1 Like
#3

Thanks, but I’m currently looking for direction rather than raycast or magnitude.

Unless I missed something in the video I shouldn’t have missed :eyes:

#4

Are you using a 2D position and a 3D position? I am confused srry… You can‘t position a Gui via Vector2

1 Like
#5

2D Position, in pixels.

Correct, which is why I do this:
pos = Udim2.new(0,Vector.X,0,Vector.Y)

#6

A-B is used to get the direction from point B to point A

With this formula you can do something like this:

local direction = BGui.AbsolutePosition + (AGui.AbsolutePosition - BGui.AbsolutePosition)
print(direction)

Or something like this. And in the video, you know how to get one direction to another. This is why i linked it. For creating a ray, you need both directions.

#7

Right, I am familiar with unit directions for same input and output.
Do you know of a way to use that direction, and convert it into an integer?
So far, I’ve tried using atan2, but I can’t figure out why it won’t work.

#8

Something like this should work:

local function GetAngle(v1,v2)
    local dir = v1 - v2
	local Angle =  math.atan2(dir.y,  dir.x)
	return  math.deg(Angle)
end
2 Likes
#9

Why? can you say us, what exactly you want to do? This would help us to understand your problem.

#10

Thanks! (I was just coming back to say I got the solution, which is close to what you posted)
My code:

			local posScreen = cam:WorldToScreenPoint(final_pos)
			local x0,y0 = label.Position.X.Offset,label.Position.X.Offset
			local x,y = posScreen.X,posScreen.Y--lerp(x0,posScreen.X,delta^0.1),lerp(y0,posScreen.Y,delta^0.1)
			local trans = lerp(label.TextTransparency,0,delta ^ 0.8)
			local midPosX,midPosY = (x + midX)/2,(y + midY)/2
			local dir = screenSize/2 - Vector2.new(posScreen.X,posScreen.Y)
			
			label.Position = UDim2.new(0,math.clamp(x,b,screenSize.X-b),0,math.clamp(y,b,screenSize.Y-b))
			label.TextTransparency = trans
			label.Text = "[E]" .. closest.Name
			
			esp.BackgroundTransparency = 0
			esp.Position = UDim2.new(0,midPosX,0,midPosY)
			esp.Rotation = math.atan2(dir.Y,dir.X) * (180/math.pi)
			esp.Size = UDim2.new(0,dir.Magnitude,0,1)

Specifically, this: math.atan2(dir.Y,dir.X) * (180/math.pi)

@Eternalove_fan32 See this clip:
https://streamable.com/l7496u

2 Likes
#11

Then not mark @Jaycbee05 reply as solution? Without him, you wouldn’t get the answer so easily. Otherwise, I’m happy for you!

1 Like
#12

Guess I will, but I was able to find it out before his reply.
Regardless, thanks for your help!

1 Like