Javascript извлечь значение в скобках между запятыми (Увеличить аргументы функции преобразования элемента)

Question

Контекст здесь прост, я хочу захватить значение transform css из графического элемента и увеличить его на 10.

В моем случае единственное преобразование, которое у меня есть, это translate, но в идеале это будетработать, если есть другие, а я только хочу изменить значение перевода.

Я отметил это как регулярное выражение, но не уверен, если это необходимо.

const myElement = document.getElementById('myElement');
const translateString = myElement.getAttribute('transform');
const newTranslateString = increaseArgumentsBy10(translateString);
myElement.setAttribute('transform', newTranslateString);


function increaseArgumentsBy10(translateString) {
  console.log('To be implemented');
  return translateString;
}

<svg>
  <text id="myElement" transform="translate(50,50)">My Element
  </text>
</svg>

Answer 1

вы можете создать функцию translate и использовать eval

const myElement = document.getElementById('myElement');
const translateString = myElement.getAttribute('transform');
const newTranslateString = increaseArgumentsBy10(translateString);
myElement.setAttribute('transform', newTranslateString);


function increaseArgumentsBy10(translateString) {
  function translate(x, y) {
   	return('translate(' + (x + 10) + ', ' + (y + 10) + ')'); 
  }
  return eval(translateString);
}

<svg>
  <text id="myElement" transform="translate(50,50)">My Element
  </text>
</svg>