如何更新 d3 图的数据？

Question

我有一个 d3 图，我想在图中显示经常变化的数据点。 目前，每次更新数据对象时，我都会重绘完整图：

 container.remove()
 container = svg.append("g");
 drawContainer();

使用 drawContainer 中的绘图功能：

container.selectAll(".dot")
  .data(datajson)
  .enter().append("circle")
  .attr("class", "dot")
  .attr("r", 3.5)
  .attr("cx", xMap)
  .attr("cy", yMap)
  .style("fill", function(d) { return color(cValue(d));}) 

我试着简单地打电话：

  container.selectAll(".dot")
      .data(newdata)

添加新数据点，但这并没有使新数据点可见。 如何仅使用新数据点更新绘图？

Answer 1

我认为你可以做一些类似于调用drawContainer();事情drawContainer();

代替

container.selectAll(".dot")
  .data(newdata);

你可以这样做：

var dots = container.selectAll(".dot")
   .data(newdata);
dots.enter().append("circle")
  .attr("class", "dot")
  .attr("r", 3.5)
  .attr("cx", xMap)
  .attr("cy", yMap)
  .style("fill", function(d) { return color(cValue(d));});
dots.exit().remove();

完整示例： https : //bl.ocks.org/mbostock/3808218