Warning: file_get_contents(/data/phpspider/zhask/data//catemap/1/cocoa/3.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 从矩阵3d中获得精确的旋转角度_Javascript_Html_Css_Css Transforms - Fatal编程技术网

Javascript 从矩阵3d中获得精确的旋转角度

Javascript 从矩阵3d中获得精确的旋转角度,javascript,html,css,css-transforms,Javascript,Html,Css,Css Transforms,我有一些元素 <div id="element"></div> 有没有办法从计算样式中获得精确的(-1100)旋转角度 window.getComputedStyle返回矩阵3d var element = document.getElementById('element'), cs = getComputedStyle(element), matrix = new WebKitCSSMatrix(cs['-webkit-transform']); 但

我有一些元素

<div id="element"></div>
有没有办法从计算样式中获得精确的(-1100)旋转角度

window.getComputedStyle
返回矩阵3d

var element = document.getElementById('element'),
    cs = getComputedStyle(element),
    matrix = new WebKitCSSMatrix(cs['-webkit-transform']);
但是如何从这个矩阵中提取旋转角度呢


我需要计算样式,因为我试图在元素转换期间获得角度。

我找不到一个简单的方法来实现它,但在的帮助下,我成功地获得了值(某种程度上)

它返回-20,即-360*3=-1080+增加的20度旋转-20评论中的一些人注意到,当角度超过180度时,它不起作用,并且提供,但它只在360度时起作用


我认为如果您使用javascript来动态控制元素的转换,会容易得多,因为没有更简单的方法来获取旋转的
getComputedStyle
值。

据我所知,不可能获得精确的角度,因为360度和720度的矩阵是相同的。但我在你建议的360度解决方案的帮助下解决了这个问题。非常感谢。
var element = document.getElementById('element'),
    cs = getComputedStyle(element),
    matrix = new WebKitCSSMatrix(cs['-webkit-transform']);
var myElement = document.getElementById('element');
var myTransform = window.getComputedStyle(myElement,null)
var myTransform = myTransform.getPropertyValue("-webkit-transform");
var myTransform = myTransform.split(' ');
var myX = myTransform[6].split(",")[0];
var angle = Math.round(Math.asin(myX) * (180/Math.PI));
console.log(angle);