Nie mogę określić, jak najlepiej przekazywać zmiany do danych, które występują w węźle nadrzędnym (np. SVG)g element) w dół do jego dzieci (np. SVGcircle elementy).

Przeczytałemto ito ale wciąż nie mogę tego zrozumieć.

Oto minimalny przykład działania. Przykład zakłada, że ​​masz wywołany obiektsvg który odnosi się do wyboru d3 zawierającego element 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); });   

Czy ktoś może mi pomóc znaleźć zwięzły sposób, aby uzyskać nowe nazwy we wszystkich elementach potomnych grupy? W moim prawdziwym przykładzie każdyg zawiera wielecircles.