Jquery鼠标滚轮问题答案

【问题标题】：Jquery Mousewheel issueJquery鼠标滚轮问题
【发布时间】：2015-09-23 18:09:03
【问题描述】：

我正在使用 svg 地图，我希望能够放大/缩小和平移。使用mousewheel plugin 但出现错误：

Error: Invalid value for <svg> attribute viewBox="NaN NaN NaN NaN"

所以缩放不能正常工作，请看我的例子：

http://jsfiddle.net/41sz0068/14/

我正在使用 Mapael：

$(".container").mapael({
    map : {
        name : "my_map"
        , zoom : {
            enabled : true,
            maxLevel : 10
        }
    }
});

【问题讨论】：

如果您在使用鼠标滚轮之前单击 +/- 图标，它可以正常工作。看起来某些值可能未初始化，然后您收到错误
确实，是否有任何“黑客”来防止该错误？用鼠标中键或 ctrl+click 拖动也不起作用。
如果这是代码中的错误，您应该向维护代码的人员报告，以便他们修复。

标签： jquery svg raphael mapael

【解决方案1】：

正如 cmets 中所指定的，发生这种情况是因为某些值没有相应地初始化，并且在使用鼠标滚轮时会出现错误。如果您之前使用过放大/缩小功能，则不会发生这种情况。

一种可能的解决方法：在页面加载时触发缩小功能。由于图像将始终在没有缩放的情况下开始，因此缩小不会影响 svg，并且它将初始化一开始未初始化的所有变量：

$(function() {
    $("div.zoomOut").click();
});

你可以在你的 JSFiddle 上看到它：http://jsfiddle.net/41sz0068/15/

【讨论】：