Inzoomen op alles

ReneRubalcava

<\/HEAD>

<\/P>

Laten we deze kort en krachtig houden. Hoe vaak heb je gewerkt met de ArcGIS API for JavaScript en moest je inzoomen op een feature. Heb je je hoofd gekrabd bij sommige vreemde gedragingen van het gebruik van map#centerAndZoom<\/A>? Misschien betrapte je jezelf erop dat je switch\/case of if\/else statements schreef om in te zoomen op de kaart afhankelijk van of je nu inzoomde op een punt, een polygoon of een polyline.<\/SPAN><\/SPAN><\/P><\/P>Lees de documentatie<\/STRONG><\/SPAN><\/P>Voordat we kijken hoe je eenvoudig kunt inzoomen op features, laten we eens kijken waarom de centerAndZoom methode door de map wordt gehaat.<\/SPAN><\/P>De methodesignatuur van centerAndZoom is centerAndZoom(mapPoint, levelOrFactor). Wat betekent levelOrFactor? Laten we naar de definitie kijken.<\/SPAN><\/P><\/P>"<\/STRONG>Bij gebruik van een <\/SPAN>ArcGISTiledMapServiceLayer<\/STRONG><\/SPAN>, wordt er ingezoomd op het opgegeven niveau. Bij gebruik van een <\/SPAN>DynamicMapServiceLayer<\/STRONG><\/SPAN>, wordt er ingezoomd of uitgezoomd met de opgegeven factor. Bijvoorbeeld, gebruik 0.5 om twee keer zo ver in te zoomen en 2.0 om twee keer zo ver uit te zoomen."<\/STRONG><\/SPAN><\/EM><\/SPAN><\/P><\/P>Dat is veel beter. Nietwaar? Nog steeds verward? Oké, eigenlijk als je een <\/SPAN>ArcGISTiledMapServiceLayer <\/SPAN>gebruikt kun je inzoomen op een specifiek detailniveau. Denk aan de zoomschuifregelaar op een kaart. Maar als je een <\/SPAN>DynamicMapServiceLayer <\/SPAN>gebruikt dan wordt het ingewikkeld. Nu kun je twee keer zo ver inzoomen of uitzoomen, maar je moet de factor als decimaal opgeven, dus denk aan percentages. Ik neem aan dat je twee keer zo ver wilt inzoomen, dus 0.5 lijkt een veilige gok, maar als je 0.25 zou gebruiken, zou dat betekenen vier keer zo ver inzoomen.<\/SPAN><\/P><\/P>Doe het werk<\/STRONG><\/SPAN><\/P>Oké, met dat in gedachten weet je ongeveer wat te doen. Ik heb een klein moduletje gemaakt toen ik het zat was steeds hetzelfde te schrijven en te controleren op geometrie types en verschillende scenario's. Ik durf te wedden dat dit 90% van de situaties aankan die je tegenkomt (Ik heb geen harde cijfers om dit te onderbouwen, maar vertrouw me erop<\/EM>).<\/SPAN><\/P>define([
  'dojox/lang/functional/curry'
], function(curry) {
    var zoom = curry(function(map, geometry) {
      if (geometry.type === 'point') {
        var mz = map.getMaxZoom() ;
        if (mz >-1) {
            map.centerAndZoom(geometry, mz - 2);
        } else {
            map.centerAndZoom(geometry, 0.25);
      }
    } else {
      map.setExtent(geometry.getExtent());
   }
 } );
 
 
 
 
return zoom;
});

Hier is een live demo<\/A>.<\span>

\n

Dus controleer je eigenlijk of de geometrie een punt is. Als het een punt is, krijg je het maximale zoomniveau van de kaart. Op dit punt heb je twee keuzes:<\span>

\n

\n
1. \nAls het groter is dan -1, zoom dan naar dat niveau en trek er 2 vanaf zodat je niet te dicht inzoomt. Of niet, dat is aan jou.<\span>\n
\n
2. \nZoom in met een factor van 0.25, wat betekent vier keer zo ver inzoomen als het huidige zoomniveau.<\span>\n
\n

\n

\nAls de geometrie geen punt is, is het eenvoudig, polygonen, polylijnen en multipunten kunnen een extent teruggeven,<\A> dus kun je gewoon de huidige extent van de kaart instellen op de extent van de geometrie.<\span>\n

\n

\n

\nZet het nog een stapje hoger<\/strong>\n

\n

\nDit werkt vrij goed, maar stel dat je een flexibelere oplossing wilt. De bovenstaande versie werkt prima wanneer er een geometrie wordt doorgegeven, maar wat dacht je van een graphic of een array van graphics? Dit zijn allemaal geldige objecten waar je misschien op wilt inzoomen. Dus daarvoor bouwen we een module die vrijwel alles aankan wat je erin gooit.

\n

noopener noreferrer" target="_blank">demo van deze module <\/A> in actie.<\/SPAN><\/P>

<\/P>

Bam klaar!<\/STRONG><\/SPAN><\/P>Woah woah<\/EM>. Wat is dit voor curry<\/A> onzin? Oké, ik heb deze er stiekem ingesmokkeld. Het gebruik van curry stelt je in staat om functies gedeeltelijk te evalueren. Dat betekent dat je de map aan de functie doorgeeft voordat je de geometrie hoeft door te geven. Hier is een uitleg over curry in JavaScript<\/A>.<\/SPAN><\/P>

Dit is geen harde vereiste, maar het maakt het wel wat spannender.<\/SPAN><\/P><\/P>Speel ermee, wijzig het, misbruik het en codeer.<\/SPAN><\/P><\/BODY><\/HTML>