使用js從element的matrix推導transform的scale、rotate 和 translate引數

transform

網上很多都只介紹了還原角度和縮放的引數，但是沒有就偏移量的計算，自己還原了一下公式的意義，進行了公式的反推，具體的推到過程就不詳敘了，可以參看w3c的矩陣含義。

直接上乾貨。

    function getElementCss(e, name)
    {
        var st = window.getComputedStyle(e, null);
        return st.getPropertyValue(name);
    }
    function getTransformPara(elem)
    {
        // var elem = document.getElementById(id);
        var tr = getElementCss(elem, "-webkit-transform");  
        if(tr!="none")
        {
            var values = tr.split("(")[1].split(")")[0].split(",");
            var a = values[0];
            var b = values[1];
            var c = values[2];
            var d = values[3];
            var e = values[4];
            var f = values[5];
            var scale1 = Math.sqrt(a * a + b * b);
            var scale2 = Math.sqrt(c * c + d * d);
            var angle = Math.atan2(b, a) * (180.0 / Math.PI);
            e = parseFloat(e);
            f = parseFloat(f);              
            var radian = -Math.PI/180.0*angle;
            var lastX = Math.cos(radian)*e - Math.sin(radian)*f;
            var LastY = Math.sin(radian)*e + Math.cos(radian)*f; 
            return {
                ScaleX: scale1,
                ScaleY: scale2,
                Angle: angle,
                MovX: lastX,
                MovY: LastY,
            };
        }
        else
        {
            return {
                ScaleX: 1,
                ScaleY: 1,
                Angle: 0,
                MovX: 0,
                MovY: 0,
            };
        }          
    }