How to find the roation between two frames

GoddlyGut · February 27, 2022, 4:15pm

Hey everyone!
I am creating a drawing system, and I am trying to figure out how to find the rotation between two frames. Here is an example of what I mean:

I want the line in between to fit perfectly between the two squares.

local Frame1 = script.Parent.Frame1
local Frame2 = script.Parent.Frame2

local Frame1x, Frame1y = script.Parent.Frame1.Position.X.Scale, script.Parent.Frame1.Position.Y.Scale
local Frame2x, Frame2y = script.Parent.Frame2.Position.X.Scale, script.Parent.Frame2.Position.Y.Scale


local hyp
local opp

function CalculateDistance()
	
	
	local distance = Frame1.AbsolutePosition.X - Frame2.AbsolutePosition.X
	return distance
end



if Frame1.Position.X.Scale >= Frame2.Position.X.Scale then
	opp = Frame1.Position.X.Scale - Frame2.Position.X.Scale
else
	opp = Frame2.Position.X.Scale - Frame1.Position.X.Scale
end

if Frame1.Position.Y.Scale >= Frame2.Position.Y.Scale then
	hyp = Frame1.Position.X.Scale - Frame2.Position.X.Scale
else
	hyp = Frame2.Position.X.Scale - Frame1.Position.X.Scale
end

local rot = opp/hyp


distanceX = (Frame1x + Frame2x)/2
distanceY = (Frame1y + Frame2y)/2

local newFrame = Instance.new("Frame")



newFrame.Position = UDim2.new(distanceX,0,distanceY,0)

print(math.sin(rot))


newFrame.Size = UDim2.new(0,CalculateDistance(),0,23)
newFrame.AnchorPoint = Vector2.new(0.5,0.5)
newFrame.Parent = script.Parent

uhi_o · February 27, 2022, 4:21pm

You can use the line module took from jaipack’s Nature2D module.

github.com

jaipack17/Nature2D/blob/master/src/Utilities/Line.lua

-- This utility is used to render a constraint on the screen.

-- Services and utilities
local Globals = require(script.Parent.Parent.Constants.Globals)

-- Create the constraint's instance and apply properties
local function draw(hyp: number, origin: Vector2, thickness: number, parent: Instance, color: Color3, l: Frame?, image: string?) : Frame
	local line = l or (image and Instance.new("ImageLabel") or Instance.new("Frame"))
	line.Name = "Constraint"
	line.AnchorPoint = Vector2.new(.5, .5)
	line.Size = UDim2.new(0, hyp, 0, (thickness or Globals.constraint.thickness) + (image and 15 or 0))
	line.BackgroundTransparency = image and 1 or 0
	line.BorderSizePixel = 0
	line.Position = UDim2.fromOffset(origin.X, origin.Y)
	line.ZIndex = 1

	if image then
		line.Image = image
		line.ImageColor3 = color or Globals.constraint.color
	else

This file has been truncated. show original

draw(origin: Vector2, endpoint: Vector2, parent: Instance, thickness: number, color: Color3, l: Frame?, image: string?)
which draws a line between 2 points

GoddlyGut · February 27, 2022, 4:23pm

I need to figure out the rotation tho

uhi_o · February 27, 2022, 4:24pm

Then get the created object’s Rotation property.

GoddlyGut · February 27, 2022, 4:25pm

Ok but in the source you listed above, I do not see any code relating to the rotation property

uhi_o · February 27, 2022, 4:27pm

You can modify the code to make it work better for yourself. But the function is returning the gui created, and right above the return it’s setting the rotation.

busterbob64 · February 27, 2022, 4:36pm

First we get the distance between the points:

-- these two points are probably GuiBase2d.AbsolutePosition
local point1: Vector2
local point2: Vector2 

local distance = (point1 - point2).Magnitude

What the hell is a Magnitude?

Think of Vector2 and Vector3 values as arrows starting from zero and going out to the Vector value.
For example, Vector2.new(1, 1) is an arrow going from 0, 0 to 1, 1.
Magnitude gives you the length of that arrow.

See Magnitude.

Then we calculate the rotation.

-- If it doesn't work, try flipping point1 and point2 around
local unitVector = (point1 - point2).Unit
local angleInRadians = math.atan2(unitVector.X, unitVector.Y)

local angleInDegrees = math.deg(angle)

What the hell is a unit vector?

Imagine that previous arrow, but with a length of 1.
The rotation is preserved.

Why atan2?

See Inverse trigonometric functions.

Oh, by the way – it’s math.atan2(unitVector.Y, unitVector.X).

GoddlyGut · February 27, 2022, 4:40pm

by vector 2 at the top, you mean position right?

busterbob64 · February 27, 2022, 4:41pm

Yes, those are two points on a screen.

GoddlyGut · February 27, 2022, 4:44pm

So when I wrote this, it now prints that magnitude is not a valid member of Udim2. How could I fix this?

local Point1 = Frame1.Position
local Point2 = Frame2.Position

local distance = (Point1.X-Point2.X).Magnitude

VegetationBush · February 27, 2022, 4:54pm

You’d have to use X.Offset. GuiObject.Position.X is always a UDim, which doesn’t support magnitude (because you can’t). Instead, you can either use GuiObject.Position.X.Offset or simply GuiObject.AbsolutePosition.X, which is recommended:

local distance = Point1.AbsolutePosition.X - Point2.AbsolutePosition.X

You can also just get the rotation using:

local y = -- difference in y positions
local x = -- difference in x positions
local rotation = math.atan2(y, x) * 180 / math.pi

atan2 basically creates a right triangle with the height being the provided y value and the base being the provided x value. It will then use the SOH CAH TOA rule (specifically TOA, which stands for tan, opposite, and adjacent) to calculate the missing angle:

(y is opposite, x is adjacent)

GoddlyGut · February 27, 2022, 5:04pm

Okay so that works well however, the distance is not necessarily sizing the frame correctly

VegetationBush · February 27, 2022, 5:09pm

That’s because you’re only comparing the X difference in position. You’re not accounting for the Y difference in position at all. To get the length, you would use the x and y variables we created:

and use Vector2.Magnitude or run pythagoreans on it:

--> Vector2.Magnitude
local distance = Vector2.new(x, y).Magnitude

--// OR

--> Pythagoreans
local distance = math.sqrt(x^2 + y^2)