gpt4 book ai didi

javascript - D3 v4 : Reset zoom state

转载 作者:数据小太阳 更新时间:2023-10-29 03:57:03 24 4
gpt4 key购买 nike

我有一个可以缩放的 SVG,还有一个“重置”按钮。我正在使用

重置缩放
zoom.transform(selection, d3.zoomIdentity)

这按预期工作并重置 SVG 上的缩放。但如果我再次缩放,它会缩放回上次状态。例如。我滚动,按“重置”按钮,然后缩小 -> SVG 被放大。如何重置 zoom 对象的内部缩放状态?尝试了不同的解决方案,但均无效。

这里是完整的缩放代码

//zoom cannot be done on the <svg> directly
var container = d3.select("#g5063")

var zoom = d3.zoom().
scaleExtent([0.7, 8]).
on("zoom", () => {
container.attr("transform", d3.event.transform)
})

$("#reset-zoom-button").click(() => {
zoom.transform(container, d3.zoomIdentity);
})

var svg = d3.select("#svg").call(zoom)

最佳答案

我遇到了同样的问题

this.svg.selectAll('g').call(this.zoom.transform, d3.zoomIdentity.scale(1));

然后我改成

this.svg.call(this.zoom.transform, d3.zoomIdentity.scale(1));

解决了问题。

我认为 _zoom 也将存储在 svg 级别。

关于javascript - D3 v4 : Reset zoom state,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/45570145/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com