d3.js - 绑定到以缩放行为结束的缩放

Question

如果有一种方法可以方便地在缩放行为转换结束时绑定到事件 - 当用户 mouseup 或 touchend 移动图表的东西时。这是否可以通过仅绑定所有 up 事件来实现，或者这是人们以其他方式完成的事情？

Answer 1

在 d3 v4 中，zoom.on 类型名称已更改。它们现在是“开始”、“缩放”和“结束”。

  var d3zoom = d3.zoom()
    .on("start", zoomStartFunction)
    .on("zoom", zoomFunction)
    .on("end", zoomEndFunction);

  svg.call(d3zoom);

查看非常有用的文档。

Answer 2

我正在寻找同样的东西，我找到了这篇文章。

你可以这样写：

var svg = outer.append("svg:g")
            .call(d3.behavior.zoom()
                    .on("zoom", rescale)
                    .on("zoomstart", zoomStart)
                    .on("zoomend", zoomEnd))
            .on("dblclick.zoom", null)
            .append("svg:g");

function zoomStart(){
    console.log("ZOOM START");
}

function zoomEnd(){
    console.log("ZOOM END");
}

希望能帮助到你。