如何在D3 V4中控制变焦速度？

Question

我目前正在研究这个bl.ocks：https://bl.ocks.org/mbostock/431a331294d2b5ddd33f947cf4c81319的Mike Bostock缩放功能，我意识到可以从这一行控制介绍缩放的速度：

.duration(1500)

还有这样一种控制滚动缩放的方法吗？

Answer 1

您可以使用wheelDelta功能执行此操作 制作轮三角函数

function myDelta() {
  return -d3.event.deltaY * (d3.event.deltaMode ? 120 : 1) / 1500;
}

您可以将常数1500增加到您选择的任何数量以调节增量。

现在缩放定义wheelDelta，如下所示：

var zoom = d3.zoom()
    .scaleExtent([1, 32])
    .translateExtent([[0, 0], [width, height]])
    .extent([[0, 0], [width, height]])
    .wheelDelta(myDelta)//your function
    .on("zoom", zoomed);

参考here

工作代码here