I'm working on a project, that takes 2 similar elements and allows you to adjust the angle of the center-line by grabbing the right side and moving it up or down.
In this scenario, lets use the key:
circles are 20mm each
centerpoint to centerpoint of the circles is 120mm total. Making the distance between the outer edges 100mm.
If i wanted to ensure that the distance of the 2 center points (call it reach), were to remain 120mm, would the right side circle ever adjust on the x-axis to ensure this? or as long as it only moves the y-axis, that reach should stay the same? If it would need to be adjusted, what function should I look into?
To get the YAxis value I am using the following:
circHeight / 2 * Math.tan(angle * Math.PI / 180)
I tried adjusting this xAxis as well, but I'm unsure if I even needed to.
Math.cos(angle * Math.PI / 180) * initialDistance
where initialDistance would be 120.
Sorry if thats not the correct terminology.
TL DR
Yes, for any given angle you will need to adjust the x axys.
Intuition
Start with the two centers aligned on the x axys. If you move the center up the new distance between the two centers will be the hypotenus of a right triangle. The old one will be one of its catethes and so it will be smaller then the new distance
Calculation
You can compute the coordinates of the rotated circle by using the rotation matrices. Assume the center of the left circle is the origin of a coordinates system. Let the coordinates of the right circle be $(x_c,y_c)$. Then after a rotation of an angle $\theta$ you will have $$ x'_c= x_c \cos(\theta)-y_c \sin(\theta) $$ $$ y'_c=x_c \sin(\theta) + y_c \cos(\theta) $$ In your numerical example $x_c=120$ $y_c=0$