No puedo encontrar la mejor manera de pasar los cambios a los datos que ocurren en un nodo principal (por ejemplo, un SVGg elemento) hasta sus hijos (por ejemplo, SVGcircle elementos).

he leídoesta yesta Pero todavía no puedo entenderlo.

Aquí hay un ejemplo mínimo de trabajo. El ejemplo asume que tienes un objeto llamadosvg que se refiere a una selección d3 que contiene un elemento SVG.

data = [{"id":"A","name":"jim"},{"id":"B","name":"dave"},{"id":"C","name":"pete"}];

g = svg.selectAll("g").data(data, function(d) { return d.id; }).enter().append("g");

g.append("circle")
      .attr("r", 3)
      .attr("cx", 100)
      .attr("cy", function(d,i) {return 100 + (i * 30);})

// The data gets passed down to the circles (I think):
console.log("circle data:");
d3.selectAll("g circle").each(function(d) { console.log(d.name); });     

// Now change the data, and update the groups' data accordingly
data = [{"id":"A","name":"carol"},{"id":"B","name":"diane"},{"id":"C","name":"susan"}];
svg.selectAll("g").data(data, function(d) { return d.id;});

// These are the results of the change:
console.log("after change, the group has:");
d3.selectAll("g").each(function(d) { console.log(d.name); });     
console.log("but the circles still have:");
d3.selectAll("g circle").each(function(d) { console.log(d.name); });   

¿Puede alguien ayudarme a encontrar una forma concisa de incluir los nuevos nombres en todos los elementos secundarios de un grupo? En mi ejemplo de la vida real, cada unog contiene muchoscircles.