Как взаимодействовать с помощью js на свойство transform?

Question

[zeni1agent]

Как я могу прочитать каждое свойство transform если
$('#'+name).css('transform')
возвращает мне его в формате matrix.
А мне нужно что бы он мне вернул

rotate(0deg); translate(120px, 50%); scale(2, 0.5); skew(30deg, 20deg);

Можно в виде массива
Что бы после изменить один из параметров и установить его в
$('#'+name).css({'transform': val });
Мой код

Comments

[RAX7]

Получение и изменение transform через getcomputedstyle?

Answer 1

[nokimaro]

распарсить matrix регулярками
смотрите первый ответ в Как получить значение свойства transform: translateX(jQuery)?
и примеры кода в https://stackoverflow.com/a/43065744/2145125

так же можно использовать эту библиотеку для работы с transform через js
https://github.com/jlmakes/rematrix

Comments

[zeni1agent]

Вы можете сказать как в rematrix
Получить какое либо значение из

rotate(0deg); translate(120px, 50%); scale(2, 0.5); skew(30deg, 20deg);

Потому что в документаций я нашел только как преобразовать свойство в matrix
Rematrix.rotateZ(45)
И как перевести несколько свойств в matrix

let element = document.querySelector('#example')
let style = getComputedStyle(element).transform

let transform = Rematrix.fromString(style)

let r1 = Rematrix.rotateZ(20)
let r2 = Rematrix.rotateZ(65)
let r3 = Rematrix.rotateZ(-40)

let product = [transform, r1, r2, r3].reduce(Rematrix.multiply)

Я не смог найти как из matrix достать какое либо свойство
И если он все таки возвращает то в каких единицах измерения (deg, px, %)&