どのようにd3ブラシをリセット/クリアしますか？

Question

D3バージョン4.2.2

私は、ユーザーがブラシの選択でズーム保つことができるようにしたいチャートを持っています。最後のイベントでブラシをクリアまたはリセットして、古いブラシが表示されないようにします。

現在の活字体コード：

let brushGroup = this.svg.append('g') 
     .attr('class', 'brush'); 

    let b = brushX() 
     .on('start',() => { 
      console.log('start brush'); 
      brushGroup.style('opacity', 100); 
     }) 
     .on('end',() => { 
      console.log('end brush', event.selection); 
      // remove and display none destroy the brush, so use opacity 
      brushGroup.style('opacity', 0); 

      this.updateDateRange(this.xScale.invert(event.selection[0]), 
       this.xScale.invert(event.selection[1])); 
     }); 

    brushGroup.call(b); 
    console.log(brushGroup); 

• display: noneは将来のブラシがイベントに
• brushGroup.remove()を起動しないようにもブラシ
• 不透明度は動作しますが、ブラシがまだそこにある（マウスカーソルが上の変更破棄ホバー）

ブラシをクリアまたはリセットする正しい方法は何ですか？

1. 0,0に移動するだけですか？
2. 古いブラシを破棄し、毎回新しいブラシを作成する必要がありますか？

Answer 1

selection.call（brush.move、null）;

https://github.com/d3/d3-brush/issues/10