Значения матрицы jQuery из CSS

Question

Я пытаюсь получить значения Matrix из свойств преобразования CSS, но по какой-то причине он не работает.

var object = $(this); 

var transMatrix = object.css("-webkit-transform") || 
        object.css("-moz-transform") || 
        object.css("-ms-transform") || 
        object.css("-o-transform") || 
        object.css("transform"); 

console.log("Matrix = " + transMatrix); 

var values = transMatrix.split('(')[1]; 
    values = transMatrix.split(')')[0]; 
    values = transMatrix.split(','); 

console.log("Values = " + values); 

var a = values[0]; 
console.log("a = " + a); 
var b = values[1]; 
console.log("b = " + b); 

var scale = Math.sqrt(a*a + b*b); 
console.log("Scale = " + scale);           

var sin = b/scale; 
console.log("Sin = " + sin); 

var transScale = Math.round(scale * 100)/100; 
console.log("Transform Scale = " + transScale); 

var transAngle = Math.round(Math.asin(sin) * (180/Math.PI)); 
console.log("Transform Angle = " + transAngle); 

Но когда я вывожу это, консоль показывает:

Matrix = matrix(0.496273075820661, 0.06093467170257374, -0.06093467170257374, 0.496273075820661, 0, 0) 
Values = matrix(0.496273075820661, 0.06093467170257374, -0.06093467170257374, 0.496273075820661, 0, 0) 
a = matrix(0.496273075820661 
b = 0.06093467170257374 
Scale = NaN 
Sin = NaN 
Transform Scale = NaN 
Transform Angle = NaN 

кажется, возвращается 'undefined' после того, как он получил Матричные значения из CSS (которые правильно работают)

Есть что-то не так с моим методом «split»?

Answer 1

var values = transMatrix.split('(')[1]; 
values = transMatrix.split(')')[0]; 
values = transMatrix.split(','); 

должен быть

var values = transMatrix.split('(')[1]; 
values = values.split(')')[0]; 
values = values.split(','); 

или просто цепь их:

var values = transMatrix.split('(')[1].split(')')[0].split(','); 

В самом деле, вы можете сделать это немного более чисто с использованием регулярных выражений и .match:

var values = transMatrix.match(/[\d\.]+/g);