Question

I’ve a movieclip representing an arrow (with registration point in its middle). When I click a button, the arrow must point to a certain movieclip on stage. I use this code to execute the Tween:

TweenLite.to(arrow_clip,1,{rotation:degrees});

but I can’t understand how to calculate the degrees.
I tried the following with no luck:

var degrees =Math.atan2((clip.y-arrow_clip.y),(clip.x-arrow_clip.x))*(180/Math.PI);

Can you help me?

[EDIT]: I found the following is working but I can’t completely understand why:

var degrees = -(Math.atan2(arrow_clip.x-clip.x, arrow_clip.y-clip.y))*(180/Math.PI);

Answer 1

To find the angle between two points, you can use:

atan(dy/dx) or atan2(dy,dx)

where dy = to.y - from.y and dx = to.x - from.x

This will get you radians from the horizontal axis, with 0 being to the right. The rotation property in Flash, however, is degrees from the vertical axis, with 0 being up. So you need to turn that into degrees, and the rotate by 90 degrees, because if atan says 0 radians then in Flash space, thats 90 degrees and -PI/2 radians = 0 degrees, and so on.

The following should work:

var degrees = Math.atan2(clip.y-arrow_clip.y,clip.x-arrow_clip.x)*(180/Math.PI) + 90;

The second example you posted works because it does does the 90 degree rotation by switching around the axes and inverting the result. It calculates from the clip to the arrow, then does -atan(dx/dy). Notice that its dx over dy (instead of what its supposed to be) and negates the result. The essentially does the 90 degree rotation for you.