Любой способ оживить часть группы в jquery SVG?

Question

Есть ли способ оживить часть группы в jquery svg?

Я полагаю, очевидным решением было бы создать новую группу, затем добавить выбранные узлы в эту новую группу и анимировать ее. Но есть ли способ добавить существующие узлы SVG в группу?

Например, я знаю, что вы можете сделать это:

var g = svg.group({fill: 'red'});
var c1 = svg.circle(g, 75, 75, 20);
var c2 = svg.circle(g, 115, 75, 20);
var c3 = svg.circle(g, 155, 75, 20);
$(g).animate({svgTransform: 'translate(100)'}, 500);

Но можете ли вы создать группу и добавить к ней существующие узлы?

Иначе, есть ли другой способ группировки узлов на лету?

Приветствие.

Answer 1

Вы пробовали что-то вроде этого:

var svgns = 'http://www.w3.org/2000/svg';

var svgRoot = document.getElementsByTagNameNS(svgns, 'svg')[0];

var newGroup = document.createElementNS(svgns, 'g');
var $newGroup = $(newGroup);
svgRoot.appendChild(newGroup);

var c1 = svg.circle(g, 75, 75, 20);
$newGroup.append(c1);