Creative Saplings

Markörer (Svenska)

december 17, 2020
No Comments

Inledning

En markör identifierar en plats på en karta. Som standard använder en markör en standardbild. Markörer kan visa anpassade bilder, i vilket fall de vanligtvis kallas ”ikoner”. Markörer och ikoner är objekt av typen Marker. Du kan ställa in en anpassad ikon i markörens konstruktör eller genom att ringa setIcon() på markören. Se mer om hur du anpassar markörbilden nedan.

I stort sett , markörer är en typ av överlägg. För information om andra typer av överlägg, se Rita på kartan.

Markörer är utformade för att vara interaktiva. Som standard får de till exempel "click" händelser, så att du kan lägga till en händelselyssnare för att visa ett informationsfönster som visar anpassad information. Du kan låta användare flytta en markör på kartan genom att ställa in markören ”s draggable egenskap till true. För mer information om dragbara markörer, se nedan.

Lägg till en markör

google.maps.Marker -konstruktören tar en enda Marker options bokstavligt objekt, som anger de ursprungliga egenskaperna för markören.

Följande fält är särskilt viktiga och ställs ofta in när man konstruerar en markör:

  • position (obligatoriskt) anger en LatLng som identifierar markörens initialallokering. Ett sätt att hämta en LatLng är att använda Geocoding-tjänsten.
  • map (valfritt) anger Map som markören ska placeras på. Om du inte anger kartan på markörens konstruktion skapas markören men är inte kopplad till (eller visas på) kartan. Du kan lägga till markören senare genom att ringa markören ”s setMap() -metoden.

Följande exempel lägger till en enkel markör på en karta i Uluru, i centrala Australien:

I exemplet ovan är markören placeras på kartan vid markeringens konstruktion med egenskapen map i markeringsalternativen. Alternativt kan du lägga till markören på kartan direkt med markören ”s setMap() -metod, som visas i exemplet nedan:

Markören ”s title visas som en verktygstips.

Om du inte vill skicka någon Marker options i markörens konstruktör, skicka istället ett tomt objekt {} i det sista konstruktörens argument.

Visa exempel

Ta bort en markör

För att ta bort en markör från kartan, ring setMap() metod som skickar null som argument.

marker.setMap(null);

Observera att ovanstående metoden tar inte bort markören. Det tar bort markören från kartan. Om du istället vill ta bort markören bör du ta bort den från kartan och sedan ställa in markören på null.

Om du vill hantera en uppsättning markörer bör du skapa en matris för att hålla markörerna. Med den här matrisen kan du sedan ringa setMap() på varje markör i matrisen i tur och ordning när du behöver ta bort markörerna. Du kan radera markörerna genom att ta bort dem från kartan och sedan ställa in matrisen ”s length till 0, vilket tar bort alla referenser till markörer.

Visa exempel

Animera en markör

Du kan animera markörer så att de uppvisar dynamisk rörelse under en mängd olika omständigheter. markören är animerad, använd markören ”s animation egenskap, av typen google.maps.Animation. Följande Animation -värden stöds:

  • DROP indikerar att markören ska falla från toppen av kartan till dess slutliga plats när den först placeras på kartan. Animeringen upphör när markören vilar och animation återgår till null. Denna typ av animering anges vanligtvis under skapandet av Marker.
  • BOUNCE indikerar att markören ska studsa in plats. En studsande markör fortsätter att studsa tills dess animation -egenskapen är uttryckligen inställd på null.

Du kan initiera en animering på en befintlig markör genom att anropa setAnimation() på Marker -objektet.

Om du har många markörer , kanske du inte vill släppa dem på kartan på en gång. Du kan använda setTimeout() för att placera dina markörers animationer med ett mönster som visas nedan:

function drop() { for (var i =0; i markerArray.length; i++) { setTimeout(function() { addMarkerMethod(); }, i * 200); }}

Visa exempel

Anpassa en markörbild

Om du vill visa en bokstav eller ett nummer på en markör kan du använda en marköretikett.Om du behöver större anpassning kan du definiera en ikon som ska visas istället för standardmarkörbilden. Att definiera en ikon innebär att man ställer in ett antal egenskaper som bestämmer markörens visuella beteende.

Avsnitten nedan beskriver marköretiketter, enkla ikoner, komplexa ikoner och symboler (vektorikoner).

Marköretiketter

En marköretikett är en bokstav eller ett tal som visas inuti en markör. Markörbilden i detta avsnitt visar en marköretikett med bokstaven ”B”. Du kan ange en marköretikett som antingen en sträng eller ett MarkerLabel -objekt som innehåller en sträng och andra etikettegenskaper.

När du skapar en markör kan du ange en label egenskap i MarkerOptions -objektet. Alternativt kan du ringa setLabel() på markörobjektet för att ställa in etiketten på en befintlig markör.

Följande exempel visar märkta markörer när användaren klickar på kartan :

Enkla ikoner

I det mest grundläggande fallet kan en ikon indikera en bild som ska användas istället för standardnätikonen för Google Maps. För att ange en sådan ikon ställer du in markörens ”s icon -egenskap till webbadressen för en bild. Maps JavaScript API kommer att storleksställa ikonen automatiskt.

Komplexa ikoner

Du kanske vill ange komplexa former för att indikera regioner som är klickbara och ange hur ikonerna ska visas i förhållande till andra överlägg (deras ”stack-ordning”). Ikoner som anges på detta sätt ska ställa in deras icon egenskaper för ett objekt av typen Icon.

Icon objekt definierar en bild. De definierar också size för ikonen, origin för ikonen (om bilden du vill är en del av en större bild i en sprite, till exempel) och anchor där ikonens hotspot ska placeras (som baseras på ursprunget).

Om du använder en etikett med en anpassad markör kan du placera etiketten med labelOrigin egenskapen i -objekt.

Konvertera MarkerImage objekt till typ Icon

Fram till version 3.10 av Maps JavaScript API definierades komplexa ikoner som MarkerImage -objekt. Icon objektlitteratur lades till i version 3.10 och ersätter MarkerImage från version 3.11 och framåt. Icon objektbokstäver stöder samma parametrar som MarkerImage, så att du enkelt kan konvertera en MarkerImage till en Icon genom att ta bort konstruktorn, slå in de tidigare parametrarna i {} ”s och lägga till namnen på varje parameter. Till exempel:

blir

Symboler

Förutom rasterbilder stöder en markör visning av vektorsökvägar som heter Symbols För att visa en vektorsökväg, skicka ett Symbol bokstavligt objekt med önskad sökväg till markörens ”s icon -egenskap. Du kan använda en av de fördefinierade sökvägarna i google.maps.SymbolPath eller definiera en anpassad sökväg med SVG-sökväg.

Mer information finns i dokumentationen för symboler.

Skapa en markör dragbar

För att låta användare dra en markör till en annan plats på kartan, ställ in draggable till true i marköralternativen.

Ytterligare marköranpassning

För en helt anpassad markör, se det anpassade popup-exemplet.

Articles
Previous Post

Ta ansvar för din hälsa: En guide för tonåringar

Next Post

Crawfish Boil (Svenska)

Lämna ett svar Avbryt svar

Senaste inläggen

  • Världens bästa fotoskolor, 2020
  • Suveräna medborgare tar sin regeringsfilosofi mot vägarna
  • Guide för reparation av stuckaturer
  • Muckrakers (Svenska)
  • Precision Oncology (Svenska)

Arkiv

  • februari 2021
  • januari 2021
  • december 2020
  • november 2020
  • oktober 2020
  • september 2020
  • Deutsch
  • Nederlands
  • Svenska
  • Norsk
  • Dansk
  • Español
  • Français
  • Português
  • Italiano
  • Română
  • Polski
  • Čeština
  • Magyar
  • Suomi
  • 日本語
  • 한국어
Proudly powered by WordPress | Theme: Fmi by Forrss.