Javascript 如何从组中获取translate属性？

我有许多svg组，每个组中都有许多子级

如果出现

问题，请单击
组上的
，我想将我的所有组及其子组一起移动。我想知道单击的
组的
translate
属性，以便我可以移动其他组

我正在尝试获取
translate
属性，但无法获取它

这就是我尝试过的：

var svg = d3.select('body').append('svg').attr({width:300,height:300});    
var group = svg.append('svg:g').attr({
    'width':100,
    'height':100,
    'transform' : 'translate(50, 50)'
});

group.append('circle').attr({'r':30});

group.on('click', function () {
    console.log(this); //how to get the translated properties?
});

您可以使用getAttribute，例如

this.getAttribute("transform")

或者

baseVal.numberOfItems获取转换中有多少组件，并获取其类型，即在本例中为2=translate

在Firefox上为我发出50、50的警报。
罗伯特的回答已经涵盖了如何解决这个问题，但这里还有D3的解决方法。特别是，您可以使用
d3.transform（）
解析
transform
属性的值：

var t = d3.transform(d3.select(this).attr("transform"));
console.log(t.translate);

更新的JSFIDLE
 请你更新一下我的
jsfiddle
好吗？因为我没有得到作为对象的值。相反，我从这个字符串中得到的是
translate（50，50）
，如何得到
x
和
y
（即x和y）中的每一个，如果您想将它们作为对象，您需要SVG DOM，这是我在回答中给出的第二个选择。是的，我尝试了应用
2
，没有任何安慰。你能在小提琴上更新一下吗？我这么做了，不过这只是答案的复制和粘贴。
var t = d3.transform(d3.select(this).attr("transform"));
console.log(t.translate);