javascript - 双击 d3 删除路径

Question

我有以下代码在 SVG Canvas 上附加一行。当我双击路径时，当弹出警报框时，我能够运行范围，但该行本身不会被删除。我哪里错了？我是否错误地使用了this？

var lineFunction = d3.svg.line()
                     .x(function(d) { return d.x; })
                     .y(function(d) { return d.y; })
                     .interpolate("step");

lineGraph = layer.append("path")
              .attr("d", lineFunction(lineData))
              .attr("stroke", "black")
              .attr("stroke-width", 1)
              .attr("fill", "none")
              .attr("id","aggregation")
              .attr("data", "newline")
              .style('marker-end', "url(#end-arrow)")
              .on("dblclick",function(d){
                alert("double");
                d3.this.remove();
              });

Answer 1

方法.remove()需要在 D3 选择时调用。在事件处理程序中，您可以通过执行

来获取包含作为事件目标的元素的选择

d3.select(this)

因此，将您的处理程序更改为

.on("dblclick",function(d){
   d3.select(this).remove();
});

应该可以解决问题。