Ich kann nicht herausfinden, wie Änderungen an den Daten, die auf einem übergeordneten Knoten (z. B. einer SVG-Datei) auftreten, am besten weitergeleitet werdeng Element) bis auf die untergeordneten Elemente (z. B. SVGcircle Elemente).

Ich habe gelesendiese unddiese aber ich kann es immer noch nicht herausfinden.

Hier ist ein minimales Arbeitsbeispiel. In diesem Beispiel wird davon ausgegangen, dass Sie ein Objekt mit dem Namen habensvg Dies bezieht sich auf eine d3-Auswahl, die ein SVG-Element enthält.

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); });   

Kann mir jemand helfen, einen präzisen Weg zu finden, um die neuen Namen in alle untergeordneten Elemente einer Gruppe zu übernehmen? In meinem realen Beispiel jeweilsg enthält vielecircles.