9
votes

Restreindre le zoom min / max sur une carte Bing avec V7 de la commande Ajax?

Je travaille sur un site qui utilise V7 de la commande de cartes Bing Ajax. L'une des choses que je dois faire est de limiter le niveau de zoom afin d'empêcher les utilisateurs de zoomer après un certain niveau ou de zoomer après un certain niveau.

J'ai trouvé une méthode "getzoomrange" sur l'objet de la carte, après Inspecter, il renvoie simplement un objet littéral avec des propriétés "min" et "max". Donc, j'ai pensé que je me suis surchargé que cela ferait probablement le truc: xxx

... mais non. Il n'a aucun effet (il a effectivement quelque chose à voir avec l'apparence du curseur de zoom lors de l'utilisation du tableau de bord par défaut).

détourner l'événement et l'empêcher de procéder à la procédure semble avoir aucun effet.


0 commentaires

3 Réponses :


10
votes

Selon la prise en charge des cartes Bing, le seul moyen de le faire (ce qui n'est pas particulièrement élégant et donne une gigue importune sur la carte) est la suivante:

// "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
    });
  }
};


2 commentaires

L'une des mises à jour de la raison de la V7 de l'API de Bing Cartes API de sorte que cela a cassé. Il fonctionne toujours correctement dans la plupart des cas, mais si un utilisateur zoomère agressivement à l'aide de la molette de la souris, l'événement "ViewchangangeStart" ne l'attrape pas toujours. Mon correctif était d'appeler la fonction "restrictzoom" sur l'événement "ViewChangangeStart" et "ViewChange". Je ne vérifie pas non plus que si le zoom est "> =" ou "<="; Je vérifie plutôt si le zoom est ">" ou "<". Cela fonctionne mieux de tous les exemples que j'ai trouvés.


Cela ne fonctionne pas pour moi en V8 de l'API Cartes Bing



10
votes

Je traitais avec un problème similaire et j'ai fini par faire quelque chose de très similaire à ce que Mrjamin décrit dans sa réponse, avec une différence (subtile, majeure): j'ai ajouté un gestionnaire pour TearviewCommé code>. Selon le Documents officiels sur MSDN, 'Changeté 'se produit lorsque la vue vers laquelle la carte navigue change code>. Aussi, au lieu d'appeler mappe # getzoom code>, j'ai utilisé mappe # gettargetzoom code> quel renvoie le niveau de zoom de la vue sur laquelle la carte navigue sur code>. Remarque, cette approche empêche la gigue.

Voici la version abrégée de mon code: P>

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});
    }
  });
}


1 commentaires

Cela semble donc fonctionner mais fait que la carte "rebondir" s'ils font zoomer à l'aide de la molette de la souris, et s'ils le spament suffisamment, ils sortent du zoom min / max. Aucune suggestion?



0
votes

Une autre façon d'y parvenir est de gérer l'événement jeté lorsque la roue de la souris est déplacée. http://msdn.microsoft.com/en-us/library/gg427609.aspx

Lorsque vous gérez l'événement MouseWheel CODE>, vous pouvez vérifier si la roue de la souris est en cours de défilement vers l'avant ou vers l'arrière, puis vérifiez le MAP.TARGETZOOM () CODE > Afin de comparer avec une valeur de zoom min ou max. Si le minute ou max sont dépassés, définissez événement.Handled = true code>. Cela empêche l'événement d'être géré par tout autre gestionnaire qui empêche le comportement par défaut. De la documentation: P>

Un booléen indiquant si l'événement est manipulé. Si cette propriété est défini sur true, le comportement de contrôle de carte par défaut pour l'événement est annulé. p> BlockQuote>

Voir ci-dessous: P>

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);


0 commentaires