Markører
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 enLatLng
, der identificerer startallokeringen af markøren. En måde at hente enLatLng
på er ved hjælp af Geocoding-tjenesten. -
map
(valgfrit) angiverMap
, 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 “ssetMap()
-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, oganimation
vender tilbage tilnull
. Denne type animation specificeres normalt under oprettelsen afMarker
. -
BOUNCE
angiver, at markøren skal hoppe i placere. En hoppemarkør vil fortsætte med at hoppe, indtil densanimation
egenskab udtrykkeligt er indstillet tilnull
.
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.