更改高贴图的缩放级别

Change the zoom level for highmaps

本文关键字：缩放 高贴图      更新时间：2023-09-26

我一直在努力减少按下放大/缩小按钮时地图的放大/缩小量。这似乎没有变量，并且它需要使用http://api.highcharts.com/highmaps#Chart.mapZoom

我想做的是用自定义事件覆盖放大/缩小按钮的默认事件，该事件使用mapZoom"howMuch"参数的自定义值。这是我能找到的唯一一个mapZoom功能的例子http://jsfiddle.net/z8X6B/1/:

Highcharts.Chart.prototype.mapZoom = function (howMuch, centerXArg, centerYArg, mouseX, mouseY) {}

但我还没能想出如何用自定义功能覆盖现有的放大/缩小按钮事件（我想避免创建自己的按钮）。

好问题！我浏览了地图导航按钮上的Highmaps API参考(http://api.highcharts.com/highmaps#mapNavigation.buttons)并想出了如何做到这一点：

mapNavigation: {
    buttons: {
        zoomIn: {
            // the lower the value, the greater the zoom in
            onclick: function () { this.mapZoom(0.1); }
        },
        zoomOut: {
            // the higher the value, the greater the zoom out
            onclick: function () { this.mapZoom(10); }
        }
    }
},

以下是一个基于Highmaps演示的活动小提琴：http://jsfiddle.net/brightmatrix/d51g1jt2/

根据我的测试，放大时mapZoom()的值似乎需要是缩放后仍希望看到的地图的百分比（在本例中，我们只希望看到总地图的10%）。任何值为1或更高的东西似乎都不起作用。

对于缩小，mapZoom()的值似乎是一个乘数。所以，在这种情况下，我们放大到地图值的10%，所以你的缩小是这个值的10倍。

放大和缩小的默认值分别为0.5和2，这是有意义的（放大到地图大小的50%；缩小2倍）。

我希望这些信息对你既有帮助又有用！

相关文章：