Javascript D3缩放未正确重置缩放状态和转换位置

Javascript D3缩放未正确重置缩放状态和转换位置,javascript,jquery,d3.js,zooming,scale,Javascript,Jquery,D3.js,Zooming,Scale,嗯,我已经让它工作,但不知怎的,当测试现在它不工作了。因此,在我的项目中,我有一个地图,即缩放-和可拖动。放大或拖动时,始终可以单击重置按钮来重置整个显示。这很有效 因此,缩放定义: var g = svg.append("g"); var zoom = d3.behavior.zoom() .translate([0, 0]) .scale(1) .scaleExtent([1, maximumZoom]) .on("zoom", zoomed); svg.ca

嗯,我已经让它工作,但不知怎的,当测试现在它不工作了。因此,在我的项目中,我有一个地图,即缩放-和可拖动。放大或拖动时,始终可以单击重置按钮来重置整个显示。这很有效

因此,缩放定义

var g = svg.append("g");
var zoom = d3.behavior.zoom()
    .translate([0, 0])
    .scale(1)
    .scaleExtent([1, maximumZoom])
    .on("zoom", zoomed);
svg.call(zoom);
缩放功能是:

g.attr("transform", "translate([0,0]).scale(" + 1 + ")");
zoom.translate([0, 0]);
zoom.scale(1);
单击“重置”按钮时,重置已正确完成。但当现在缩放或拖动任何位置时,您实际上看到的是旧的缩放和位置

但奇怪的是:

zoom.translate([0, 0]);
zoom.scale(1);
应该解决这个问题。正如我一个月前所说,它工作正常

此外,还有缩放功能:

function zoomed() {
    g.attr("transform", "translate(" + d3.event.translate + ")scale(" + d3.event.scale + ")");
}

我不是100%确定,但似乎调用缩放事件,或者说稍后在svg元素上设置缩放事件,可以解决这个问题

所以只要打电话

zoom.on("zoom", zoomed);
svg.call(zoom);
一切结束后。我把它放进一个加载地图的函数中。现在它又能正常工作了

你可以看到这个网站