javascript - 重新渲染 SVG 时事件监听的问题

Question

我有以下情况:
我制作了一个绘制图表的库。我在那里进行了缩放。当您触发“鼠标滚轮”事件时 - 图表以新比例重新渲染。但几乎所有浏览器都存在问题(Chrome 除外)。在 Chrome 中，您会在单轮移动时多次收到“鼠标滚轮”事件。在其他浏览器中，您获取事件，图表重新渲染，并且没有更多事件，您应该采取更多操作来获取事件。有人知道如何解决这个问题吗？或者也许我的代码架构很糟糕？

这是wheelHandler:

function wheelHandler() {
    var pad = d3.event.type === 'mousewheel' ? d3.event.wheelDeltaY / 10 : d3.event.detail,
    newKoefficient = koefficient + pad;
    newKoefficient = Math.max(newKoefficient, config.minZoom);
    newKoefficient = Math.min(newKoefficient, config.maxZoom);
    if (newKoefficient !== koefficient) {
        koefficient = newKoefficient;
        render();
    }
}

渲染时，我清空 svg-container 并在其中重建元素。

Answer 1

你应该wheel事件而不是 mousewheel事件作为鼠标滚轮事件仅在 Chrome 上实现。