Creative Saplings

Markører

december 17, 2020
No Comments

Introduktion

En markør identificerer en placering på et kort. Som standard bruger en markør et standardbillede. Markører kan vise brugerdefinerede billeder, i hvilket tilfælde de normalt kaldes “ikoner”. Markører og ikoner er objekter af typen Marker. Du kan indstille et brugerdefineret ikon i markørens konstruktør eller ved at kalde setIcon() på markøren. Se mere om tilpasning af markørbilledet nedenfor.

Generelt , markører er en type overlay. For information om andre typer overlay, se Tegning på kortet.

Markører er designet til at være interaktive. For eksempel modtager de som standard "click" begivenheder, så du kan tilføje en begivenhedslytter for at åbne et infovindue, der viser brugerdefinerede oplysninger. Du kan tillade brugere at flytte en markør på kortet ved at indstille markøren “s draggable egenskab til true. For mere information om markører, der kan trækkes, se nedenfor.

Tilføj en markør

google.maps.Marker konstruktøren tager en enkelt Marker options bogstaveligt objekt, der angiver markørens indledende egenskaber.

Følgende felter er særligt vigtige og indstilles ofte ved konstruktion af en markør:

  • position (påkrævet) angiver en LatLng, der identificerer startallokeringen af markøren. En måde at hente en LatLng på er ved hjælp af Geocoding-tjenesten.
  • map (valgfrit) angiver Map, hvor markøren skal placeres. Hvis du ikke angiver kortet til konstruktion af markøren, oprettes markøren, men er ikke knyttet til (eller vises på) kortet. Du kan tilføje markøren senere ved at kalde markøren “s setMap() -metoden.

Følgende eksempel tilføjer en simpel markør til et kort i Uluru i centrum af Australien:

I ovenstående eksempel er markøren placeret på kortet ved opførelsen af markøren ved hjælp af map egenskaben i markørindstillingerne. Alternativt kan du tilføje markøren til kortet direkte ved hjælp af markøren “s setMap() metode, som vist i eksemplet nedenfor:

Markøren “s title vises som en værktøjstip.

Hvis du ikke ønsker at passere nogen Marker options i markørens konstruktør, skal du i stedet sende et tomt objekt {} i sidste konstruktørens argument.

Se eksempel

Fjern en markør

For at fjerne en markør fra kortet skal du ringe til setMap() metode, der sender null som argumentet.

marker.setMap(null);

Bemærk, at ovenstående metoden sletter ikke markøren. Det fjerner markøren fra kortet. Hvis du i stedet ønsker at slette markøren, skal du fjerne den fra kortet og derefter indstille selve markøren til null.

Hvis du ønsker at administrere en sæt markører, skal du oprette en matrix, der holder markørerne. Ved hjælp af dette array kan du derefter ringe til setMap() på hver markør i arrayet, når du skal fjerne markørerne. Du kan slette markørerne ved at fjerne dem fra kortet og derefter indstille arrayet “s length til 0, som fjerner alle referencer til markører.

Se eksempel

Animer en markør

Du kan animere markører, så de udviser dynamisk bevægelse under forskellige omstændigheder. For at specificere den måde, markøren er animeret, brug markøren “s animation egenskab af typen google.maps.Animation. Følgende Animation værdier understøttes:

  • DROP angiver, at markøren skal falde fra toppen af kortet til dets endelige placering, når det først placeres på kortet. Animationen ophører, når markøren hviler, og animation vender tilbage til null. Denne type animation specificeres normalt under oprettelsen af Marker.
  • BOUNCE angiver, at markøren skal hoppe i placere. En hoppemarkør vil fortsætte med at hoppe, indtil dens animation egenskab udtrykkeligt er indstillet til null.

Dig kan starte en animation på en eksisterende markør ved at kalde setAnimation() på Marker -objektet.

Hvis du har mange markører , vil du måske ikke slippe dem på kortet på én gang. Du kan bruge setTimeout() til at placere dine markørers “animationer ved hjælp af et mønster som vist nedenfor:

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

Se eksempel

Tilpas et markørbillede

Hvis du vil vise et bogstav eller tal på en markør, kan du bruge en markørmærke.Hvis du har brug for større tilpasning, kan du definere et ikon, der skal vises i stedet for standardmarkørbilledet. Definition af et ikon indebærer indstilling af et antal egenskaber, der bestemmer markørens visuelle opførsel.

Afsnittene nedenfor beskriver markørmærker, enkle ikoner, komplekse ikoner og symboler (vektorikoner).

Markøretiketter

En markøretiket er et bogstav eller tal, der vises inde i en markør. Markørbilledet i dette afsnit viser en markørmærke med bogstavet “B”. Du kan angive en markøretiket som enten en streng eller et MarkerLabel -objekt, der indeholder en streng og andre etiketegenskaber.

Når du opretter en markør, kan du angive en label egenskab i MarkerOptions -objektet. Alternativt kan du ringe til setLabel() på markørobjektet for at indstille etiketten på en eksisterende markør.

Følgende eksempel viser markerede markører, når brugeren klikker på kortet :

Enkle ikoner

I det mest basale tilfælde kan et ikon angive et billede, der skal bruges i stedet for standardknap-ikonet til Google Maps. For at specificere et sådant ikon skal du indstille markøren “s icon til webadressen på et billede. Maps JavaScript API vil størrelse ikonet automatisk.

Komplekse ikoner

Det kan være en god idé at specificere komplekse former for at angive regioner, der kan klikkes på, og angive, hvordan ikonerne skal vises i forhold til andre overlays (deres “stakrækkefølge”). Ikoner, der angives på denne måde, skal indstille deres icon egenskaber til et objekt af typen Icon.

Icon objekter definerer et billede. De definerer også size for ikonet, origin for ikonet (hvis det ønskede billede er en del af et større billede i en sprite, for eksempel) og anchor hvor ikonets hotspot skal placeres (som er baseret på oprindelsen).

Hvis du bruger en etiket med en brugerdefineret markør, kan du placere etiketten med labelOrigin egenskaben i objekt.

Konvertering af MarkerImage objekter til type Icon

Indtil version 3.10 af Maps JavaScript API blev komplekse ikoner defineret som MarkerImage objekter. Icon objekt-bogstaveligt blev tilføjet i version 3.10 og erstatter MarkerImage fra og med version 3.11. Icon objektbogstaver understøtter de samme parametre som MarkerImage, så du nemt kan konvertere en MarkerImage til en Icon ved at fjerne konstruktøren, indpakke de tidligere parametre i {} “s og tilføje navnene på hver parameter. For eksempel:

bliver

Symboler

Ud over rasterbilleder understøtter en markør visning af vektorstier kaldet Symbols For at få vist en vektorsti skal du sende et Symbol objekt med den ønskede sti til markøren “s icon. Du kan bruge en af de foruddefinerede stier i google.maps.SymbolPath eller definere en brugerdefineret sti ved hjælp af SVG-stienotation.

For mere information, se dokumentationen for symboler.

Lav en markør, der kan trækkes

For at give brugerne mulighed for at trække en markør til en anden placering på kortet, skal du indstille draggable til true i markørindstillingerne.

Yderligere markørtilpasning

Se det tilpassede popup-eksempel for en fuldt tilpasset markør.

Articles
Previous Post

Tag styring af dit helbred: En guide til teenagere

Next Post

Crawfish Boil (Dansk)

Skriv et svar Annuller svar

Seneste indlæg

  • Verdens bedste fotografiskoler, 2020
  • Suveræne borgere tager deres regeringsfilosofi til vejene
  • Guide til reparation af stuk reparationer
  • Muckrakers (Dansk)
  • Precision Oncology

Arkiver

  • februar 2021
  • januar 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.