EUE (SO answer)
http://stackoverflow.com/questions/23888477/wrong-item-clicked-when-using-the-click-event-on-a-svg-circle-using-d3
by Nivaldo
HTML
<svg class="graph" width="800" height="600"></svg>
JavaScript
var svg = d3.select('.graph');
var data = [32, 57, 293, 123, 256, 500, 111, 350];
function update(data) {
var circle = svg.selectAll("circle")
.data(data);
// enter selection
circle.enter()
.append("circle")
.on('click', function (d, i) {
console.log('I have clicked on ' + d);
data.splice(i, 1);
console.log('Data is now: ' + data);
update(data);
})
// update selection
circle.attr("fill", "steelblue")
.attr("cy", 90)
.attr("cx", function (d) {
return d;
})
.attr("r", Math.sqrt);
// exit selection
circle.exit().remove();
}
update(data);