javascript - How to retrieve the angle in css3 rotate?

Question

I have the following code which sets the rotational angle on the element:

$('#1-link-2')
                .css('height', length)
                .css('-webkit-transform', 'rotate(' + angle + 'deg)')
                .css('-moz-transform', 'rotate(' + angle + 'deg)')
                .css('-o-transform', 'rotate(' + angle + 'deg)')
                .css('-ms-transform', 'rotate(' + angle + 'deg)')
                .css('transform', 'rotate(' + angle + 'deg)');

where angle is dynamically calculated previously (its based on the position of the mouse).

I need to be able to retrieve the angle. I tried this for starters:

var angle= $("#1-link-2").css('-webkit-transform');
    $('#node-title').html(angle);   //just to print it to the screen for me

and it gave me this text

matrix(0.5425908601788315, -0.839997118120292, 0.839997118120292, 0.5425908601788315, 0, 0)

How can I retrieve the angle in degrees?

Answer 1

The first value is the cosine of the rotation angle, and the second is the sine of the rotation angle - as long as you don't have any more transforms accumulated on that element. Use your favorite math library to calculate inverse sines and cosines.

The inverse cosine of .54 is 54ish or 306 degrees. The inverse sine of -0.83 is 234ish or 306 degrees.

Hey, the right answer must be 306 degrees.

If you've forgotten your geometry, here is a refresher.