Restreindre la carte de base sur une étendue spécifique dans ArcGIS API for JavaScript 3?


8

Actuellement, j'utilise ArcGIS JS API ver 3.3 / 3.5 dans mon application.

Je souhaite restreindre le fond de carte aux États-Unis uniquement. Par exemple, on peut utiliser les fonctionnalités de navigation par défaut comme le zoom avant, le zoom arrière pour le pays américain uniquement.

Essayer les choses suivantes:

  1. J'ai défini le code d'étendue des États-Unis dans mon application, mais lorsque je fais un zoom arrière, je peux voir la carte du monde entier, je veux le restreindre dans une certaine mesure uniquement

  2. En passant par cette question: restreindre le panoramique et le zoom dans l'API ArcGIS Javascript?

  3. Restreindre le fond de carte des rues à l'aide de cette question, mais impossible de restreindre la carte: utiliser son propre fond de carte avec ArcGIS API for Javascript?

  4. J'utilise cet exemple de carte dans mon application.

Réponses:


4

Voici un exemple d'une façon de procéder: http://jsfiddle.net/gh/gist/library/pure/6050806/


4

Voici un exemple du code que j'ai utilisé pour ce faire. Cela fonctionnera pour votre cas si vous définissez l'étendue initiale de la carte pour afficher les États-Unis:

//This function limits the extent of the map to prevent users from scrolling 
//far away from the initial extent.
function limitMapExtent(map) {
    var initialExtent = map.extent;
    map.on('extent-change', function(event) {
        //If the map has moved to the point where it's center is 
        //outside the initial boundaries, then move it back to the 
        //edge where it moved out
        var currentCenter = map.extent.getCenter();
        if (!initialExtent.contains(currentCenter) && 
            event.delta.x !== 0 && event.delta.y !== 0) {

            var newCenter = map.extent.getCenter();

            //check each side of the initial extent and if the 
            //current center is outside that extent, 
            //set the new center to be on the edge that it went out on
            if (currentCenter.x < initialExtent.xmin) {
                newCenter.x = initialExtent.xmin;
            }
            if (currentCenter.x > initialExtent.xmax) {
                newCenter.x = initialExtent.xmax;
            }
            if (currentCenter.y < initialExtent.ymin) {
                newCenter.y = initialExtent.ymin;
            }
            if (currentCenter.y > initialExtent.ymax) {
                newCenter.y = initialExtent.ymax;
            }
            map.centerAt(newCenter);
        }
    });
}

Voici un exemple de jsFiddle fonctionnel: http://jsfiddle.net/sirhcybe/aL1p24xy/

En utilisant notre site, vous reconnaissez avoir lu et compris notre politique liée aux cookies et notre politique de confidentialité.
Licensed under cc by-sa 3.0 with attribution required.