d3.brushSelection（）の正しい引数は何ですか？

Question

1次元ブラシの選択値を取得しようとしていますが、d3.brushSelection（）の引数を理解するのに問題があります。ドキュメントでは、引数はノードでなければならないと言われていますが、意味が分かりません。それは、ブラシが呼び出される特定のHTML要素、またはブラシを保持するsvg要素であるはずですか？私は両方を試して、どちらもnullを返します。

var xBrush = d3.brushX() 
    .extent([[0,0], [xWidth,xHeight]]) 
    .on("brush", brushed); 

xChart.append("g") 
    .attr("class", "brush") 
    .call(xBrush); 

ブラシを作成する方法は、どうすれば選択値を取得できますか？ありがとう。

Answer 1

d3.brushSelectionの引数に指定するノードは、あなたのブラシに対応するg要素です。

は、だからあなたは、あなたのコードにわずかな変更で、

var xBrush = d3.brushX() 
    .extent([[0,0], [xWidth,xHeight]]) 
    .on("brush", brushed); 

var theBrush = xChart.append("g") 
    .attr("class", "brush") 
    .call(xBrush); 

d3.brushSelection(theBrush.node()); 

注意を

d3.brushSelection(d3.select(".brush").node())

を経由しての選択のいずれかにアクセスしたりできることをあなたのブラシの選択は、関数が返す空の場合null。