javascript - 多线图中的圆圈未更新

Question

我有一个 D3.js 多线图，每个路径峰都添加了圆圈。当我更新我的图表时，新数据的路径更新得很好，但圆圈似乎根本没有更新。这是我的代码：http: //jsbin.com/eMuQOHoV/3/edit

有谁知道我做错了什么？

Answer 1

您需要以与创建它们相同的方式更新数据点圆圈。特别是，您在创建它们时使用了嵌套选择，但在更新时却没有。这意味着数据在更新时不会正确匹配，并且没有任何反应。

更新代码应如下所示。

var sel = svg.selectAll('.series')
             .data(sources);

sel.select('path')
   .transition()
// etc

// update circles
sel.selectAll('.datapoint')
   .data(function (d) {
     return d.values;
   })
// etc

在这里完成 jsbin 。