Angle to coordinates

[Green-Alpha]

Hi,

 

I try to get coordinates for a given angle.

 

I mean i have start X/Y (in this pen 50%/100%) and a end (in this pen 0%/0%) and a fixed viewport width/height.

 

If i do it "with eyes", the angle will be approx -45 degrees. How to get the angle for the final position (the green box)  ?

 

Probably you will better understand with the code :
 

angle = 79; // Angle from the center of the red box
vw = 1280; // Viewport width/height
vh = 720;
minX = 50; // Bounds
minY = 30;
maxX = vw - 50;
maxY = vh - 30;

// I have a rectangle, an angle, a virtual boundary box, so what are the coordinates ?
coords = ?

 

I was in the way to do it by creating a virtual circle and then get angle then position for this angle by specifying size and use of PI, but it's a circle with and i expect a rectangular position.

 

I hope you understand what i mean...

 

Thank you

 

See the Pen bGdEyGr by Green-Alpha (@Green-Alpha) on CodePen

[ZachSaucier]

Hey Green-Alpha.

 

You can easily get the angle using a little bit of algebra! It's easy to get the x and y coordinates of each element in reference to the viewport. Then you can use the difference between those as the "opposite" and "adjacent" tan(angle) = opposite / adjacent to figure out what the angle is. Solving for the angle, you get angle = arctan(opposite / adjacent). See https://www.mathsisfun.com/algebra/sohcahtoa.html for more info.

 

I tried to show each step here:

See the Pen rNVxgjR?editors=0010 by GreenSock (@GreenSock) on CodePen

 

It's not clear what your end goal is. If you explained that a bit more there might be a better way to do what you're wanting to do.

[Green-Alpha]

Thank you for this reply

 

MathIsFun.com is a very good name ! In my case I was doing bubbles while math hours...and now I'm unable to do simple things like this.

 

In your pen you compute the angle, but in my case I want to get the green box position by specifying an angle.

 

The final goal is to have a rocket starting from the red box like rocket.throw(48) where 48 is the angle.

 

In this pen, the green box define the area where the rocket will explode.

 

 

Thanks again

[ZachSaucier]

2 minutes ago, Green-Alpha said:

In your pen you compute the angle, but in my case I want to get the green box position by specifying an angle.

In this pen, the green box define the area where the rocket will explode.

So you want to find the intersection of a line with the box?

 

If you want a rocket to explode if it's in that range, when the position updates just check if it has reached the bottom vertical coordinate of the green box. No angle or math necessary  At least not much.

[Green-Alpha]

I dunno why but my answer was not saved. Thank for the tip i dunno why i didn't think about it