你如何重置/清除d3刷？

Question

D3版本4.2.2

我有一个图表,我希望用户能够通过画笔选择继续放大.我想在结束事件中清除或重置我的画笔,以便用户看不到旧画笔.

当前的TypeScript代码:

    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