javascript - D3更新画笔的比例不更新画笔

Question

我想在 D3 版本 3.5.6 中创建一个可缩放、可刷的时间轴。现在我没有使用 D3 的缩放行为，而只是使用了两个缩放按钮。我的问题如下:单击按钮时，我更新比例并重绘轴和画笔。由于某种原因，画笔不会更新范围矩形和 handle ，而只会更新背景。我知道我实际上并没有更新画笔的 .extent()。但是当比例改变时画笔不应该更新吗？

这是代码的相关部分。其余的可以在 this fiddle 中找到.

document.getElementById('in').addEventListener('click', zoom.bind(null, .1));
document.getElementById('out').addEventListener('click', zoom.bind(null, -.1));

function zoom(step) {
  var offset;

  zoomScale += step;

  if(zoomScale < 1)
    zoomScale -= step;

  offset = (zoomScale * width - width) / 2;

  // updating the scale
  xScale
    .range([-offset, width + offset]);

  // redrawing the brush which doesn't seem to have effect I expected
  brushGroup
    .call(brush);

  // redrawing the axis which works fine
  xAxisGroup
    .transition()
    .call(xAxis);      
}

非常感谢!

Answer 1

显然您需要重置画笔的范围，因此内部的 xExtent 和 yExtent 变量被重置。对我来说似乎是个错误。

brush.extent(brush.extent());

https://jsfiddle.net/azksfjjw/6/