Ограничить минимальное / максимальное увеличение карты Bing с помощью v7 элемента управления AJAX? - PullRequest
9 голосов
/ 01 декабря 2010

Я работаю над сайтом, который использует v7 элемента управления BJ Maps AJAX.Одна из вещей, которые мне нужно сделать, это ограничить уровень масштабирования, чтобы пользователи не могли увеличивать или превышать определенный уровень.

Я нашел метод getZoomRange на карте.объект, после его проверки, просто возвращает литерал объекта со свойствами «min» и «max».Итак, я решил, что перегрузка, вероятно, сработает:

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

... но нет.Он не имеет никакого эффекта (на самом деле он имеет отношение к внешнему виду ползунка масштабирования при использовании панели мониторинга по умолчанию).

Перехват события и предотвращение его продолжения также, похоже, не имеют никакого эффекта.

Ответы [ 3 ]

10 голосов
/ 30 апреля 2013

Я имел дело с подобной проблемой, и в итоге я сделал нечто очень похожее на то, что MrJamin описывает в своем ответе, с одним (тонким, но существенным) отличием: я добавил обработчик для targetviewchanged. Согласно официальным документам на MSDN, 'targetviewchanged' occurs when the view towards which the map is navigating changes. Также вместо звонка Map#getZoom я использовал Map#getTargetZoom, который returns the zoom level of the view to which the map is navigating. Обратите внимание, что этот подход предотвращает дрожание.

Вот сокращенная версия моего кода:

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});
    }
  });
}
10 голосов
/ 10 декабря 2010

Согласно поддержке Bing Maps, единственный способ сделать это (что не особенно элегантно и приводит к некоторому нежелательному дрожанию на карте) заключается в следующем:

// "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
    });
  }
};
0 голосов
/ 01 октября 2014

Другим способом достижения этого является обработка события, возникающего при перемещении колесика мыши. 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);
...