使用 AJAX 控件 v7 限制 Bing 地图上的最小/最大缩放？

Question

我正在开发一个使用 Bing 地图 AJAX 控件 v7 的网站。我需要做的一件事是限制缩放级别，以防止用户放大超过某个级别或缩小超过某个级别。

我在 Map 对象上发现了一个“getZoomRange”方法，在检查它之后，它只是返回一个具有“min”和“max”属性的对象文字。所以，我认为重载它可能会起到作用：

// "map" is our Bing Maps object
map.getZoomRange = function ()
{
  return {
    max:      14
    min:      5
  };
};

……但是不行。它没有任何效果（它实际上与使用默认仪表板时缩放滑块的外观有关）。

劫持事件并阻止其继续似乎也没有效果。

Answer 1

根据 Bing 地图支持，执行此操作的唯一方法（这不是特别优雅，并且会导致地图上出现一些不受欢迎的抖动）如下：

// "map" is our Bing Maps object, overload the built-in getZoomRange function
// to set our own min/max zoom
map.getZoomRange = function ()
{
  return {
    max:      14,
    min:      5
  };
};

// Attach a handler to the event that gets fired whenever the map's view is about to change
Microsoft.Maps.Events.addHandler(map,'viewchangestart',restrictZoom);

// Forcibly set the zoom to our min/max whenever the view starts to change beyond them 
var restrictZoom = function ()
{
  if (map.getZoom() <= map.getZoomRange().min) 
  {
    map.setView({
      'zoom':       map.getZoomRange().min,
      'animate':    false
    });
  }
  else if (map.getZoom() >= map.getZoomRange().max) 
  {
    map.setView({
      'zoom':       map.getZoomRange().max,
      'animate':    false
    });
  }
};

Answer 2

我正在处理一个类似的问题，最终我做了一些与 MrJamin 在他的回答中描述的非常相似的事情，有一个（微妙但主要的）区别：我为 targetviewchanged 添加了一个处理程序。根据 MSDN 上的官方文档，'targetviewchanged ' 当地图导航的视图发生变化时会发生。另外，我没有调用 Map#getZoom，而是使用了 Map#getTargetZoom，它返回地图导航到的视图的缩放级别。请注意，这种方法可以防止抖动。

这是我的代码的缩短版本：

function restrictZoom(map,min,max) {
  Microsoft.Maps.Events.addHandler(map,'targetviewchanged',function(){
    var targetZoom = map.getTargetZoom();
    var adjZoom = targetZoom;

    if(targetZoom > max) {
      adjZoom = max;
    } else if(targetZoom < min) {
      adjZoom = min;
    }

    if(targetZoom != adjZoom) {
      map.setView({zoom:adjZoom});
    }
  });
}

Answer 3

实现此目的的另一种方法是处理鼠标滚轮移动时引发的事件。 http://msdn.microsoft.com/en-us/library/gg427609.aspx

当你处理mousewheel事件时，你可以检查鼠标滚轮是否向前或向后滚动，然后按顺序检查map.targetZoom()与最小或最大缩放值进行比较。如果超出最小值或最大值，则设置 event.handled = true。这可以防止该事件被任何其他处理程序处理，从而防止默认行为。从文档中：

一个布尔值，指示是否处理该事件。如果这个属性是
设置为 true，事件的默认地图控件行为是
已取消。

见下文：

var Zoom = {
    MAX: 10,
    MIN: 2
}

var mouseWheelHandler = function(event) {

    // If wheelDelta is greater than 0, then the wheel is being scrolled forward which zooms in
    if(event.wheelDelta > 0) {
        if(map.getTargetZoom() >= Zoom.MAX) {
            event.handled = true;
        }                        
    }
    else {
        if(map.getTargetZoom() <= Zoom.MIN) {
            event.handled = true;
        }

    }
}

Microsoft.Maps.Events.addHandler(map, 'mousewheel', mouseWheelHandler);