我正在尝试将一些自定义元素添加到我正在处理的D3项目中的画笔手柄上 - the desired final result is here - 我被D3 V4从<g>移动一直困扰着用于<rect>元素的画笔句柄的元素。 V4文档说您可以使用.handle--*类添加，删除或修改画笔句柄，但我无法使其工作。例如，当我调用时：
const brushContainer = d3.select('#brushContainer');
brushContainer.call(d3.brushX());
brushContainer.selectAll('.handle').remove();
brushContainer.append('rect')
.attr('class', 'handle handle--w');
我收到以下错误：
TypeError: undefined is not an object (evaluating 'd.type')
请注意，我不一定期望上述代码可以使用，但我无法在文档或源代码中找到任何有用的示例或任何线索。
修改：我只是想要独立添加所需的<g>，然后在x上将d3.event.selection属性更改为brush 。我希望能够使用<g>作为句柄，这种方法使它们没有点击处理程序，但如果这是Canonical Right Answer，我会继续这样做。