2016-06-13 4 views
0

SVGキャンバスに行を追加する次のコードがあります。警報ボックスがポップアップするので、パスをダブルクリックするとスコープが実行されますが、行自体は削除されません。どこが間違っていますか? thisを間違って使用していますか?ダブルクリックでパスを削除d3

答えて

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

D3の選択に呼び出される必要が.remove()方法。イベントハンドラでは、

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

にあなたのハンドラを変更すると、トリックを行う必要があり、したがって

d3.select(this) 

を実行して、イベントの対象となった要素を含む選択を得ることができます。

関連する問題