javascript - How to get a circle position in a g element in SVG using D3.js -

i have circle inside g element in svg. g element can move according x-coordinates. position of g element can change moves. circle moves in g element. question how can retrieve position of circle in svg not position in g element? tried following code not expecting: circlegroup.on("mouseover", function() { var translate = d3.transform(d3.select(this).attr("transform")).translate; alert(translate[0].x); });

may assist me retrieve position of circle in svg not in g element, please? need position of circle in order draw line starting position in svg not g element circle in. assistance appreciated. here is: jsfiddle

if want position of circle moused-over, create .on handler on circles instead of g element (this way know element received event):

... var circles = circlegroup.selectall("circle")     .data(circledata)     .enter()     .append("circle")     .on("mouseover", mouseover) ...  function mouseover() {    var self = d3.select(this);    alert(self.attr('cx')); } 

updated fiddle.

edits comment

opps, missed transition. how about:

function mouseover() {     var self = d3.select(this);     var translate = d3.transform(self.attr("transform")).translate;     alert(+self.attr('cx') + translate[0]); } 

updated fiddle 2.