Question

找到了一个潜在的解决方案，但它似乎没有用。

$('svg')
  .on("mousewheel.zoom", null)
  .on("DOMMouseScroll.zoom", null) // disables older versions of Firefox
  .on("wheel.zoom", null);

问题是点击事件正在重绘地图。在某些情况下，缩放事件未被初始化，但仍然通过SVG元素捕获滚动。当“捕获”滚动时，它会阻止页面滚动（这不是所需的行为）。有没有办法以编程方式禁用捕获滚动事件来缩放SVG？

D3似乎在飞行中具有约束力，我甚至试图明确地将绑定中断到极端：

$('.map-container, #map, g, svg, d3, div').off('scroll').unbind('scroll').undelegate('scroll');
$(window).off('scroll').unbind('scroll').undelegate('scroll');
$(document).off('scroll').unbind('scroll').undelegate('scroll');

这可能是我对绑定等基本知识的失败，或者D3可能是以非常有弹性的方式构建的。

有什么想法吗？（如果有任何答案请解释一下，这对我很好奇！）

Answer 1

<强>解

这是获得优先权的问题，并使用原生函数。

通过按钮点击等方式调用时可以正常工作。

 $('.myClass').on('click',function() {
   d3.select('#map')
     .on("mousewheel.zoom", null)
     .on("DOMMouseScroll.zoom", null)
     .on("wheel.zoom", null);
 });

我希望这有助于其他人！

Answer 2

我最好的猜测是：

$('svg').on('mousewheel DOMMouseScroll', function(e) {
    e.preventDefault();
});

禁用在地图上滚动事件

2 个答案: