Jelölők
Bevezetés
Egy jelölő azonosítja a helyet a térképen. Alapértelmezés szerint a jelölő normál képet használ. A jelölők egyedi képeket jeleníthetnek meg, ilyenkor általában “ikonoknak” nevezik őket. A jelölők és ikonok Marker
típusú objektumok. Egyéni ikont állíthat be a marker konstruktorán belül, vagy a jelölőn az setIcon()
hívásával. Az alábbiakban többet is megtudhat a jelölő kép testreszabásáról.
Széles körben A jelölők egyfajta fedvényt tartalmaznak. Az egyéb fedvénytípusokról lásd: Rajz a térképen.
A jelölőket interaktív módon tervezték. Például alapértelmezés szerint megkapják a "click"
eseményeket, így hozzáadhat egy eseményfigyelőt egy információs ablak megjelenítéséhez, amely egyéni információkat jelenít meg. Engedélyezheti a felhasználóknak, hogy jelölőt helyezzenek el a térképen az “s draggable
tulajdonság: true
. További információt a húzható jelölőkről az alábbiakban talál.
Jelző hozzáadása
A google.maps.Marker
konstruktor egyetlen Marker options
objektum literál, megadva a marker kezdeti tulajdonságait.
A következő mezők különösen fontosak és gyakran vannak beállítva a marker összeállításakor:
-
position
(kötelező) egyLatLng
értéket határoz meg, amely azonosítja a marker kezdőhelyét. ALatLng
lekérésének egyik módja a Geocoding szolgáltatás használata. -
map
(opcionális) megadja aMap
elemet, amelyre a jelölőt fel kell helyezni. Ha nem adja meg a térképet a marker szerkezetén, akkor a jelölő létrejön, de nincs csatolva (vagy nem jelenik meg) a térképen. A jelölőt később hozzáadhatja a “ssetMap()
módszer.
A következő példa egyszerű jelölőt ad hozzá az Ausztrália központjában lévő Uluruban található térképhez:
A fenti példában a jelölő elhelyezni a térképen a jelölő megépítésekor a jelölőbeállítások map
tulajdonságának használatával. Alternatív megoldásként hozzáadhatja a jelölőt a térképhez közvetlenül az “s setMap()
módszer, az alábbi példában látható módon:
A “s title
jelölő eszköztippként jelenik meg.
Ha nem kíván átadni Marker options
-t a marker konstruktorában, akkor ehelyett adja át az üres objektumot {}
az utolsóban a konstruktor argumentuma.
Példa megtekintése
Jelölő eltávolítása
Jelölő eltávolításához a térképből hívja a setMap()
metódus null
-t adja át argumentumként.
marker.setMap(null);
Ne feledje, hogy a fentiek A módszer nem törli a jelölőt. Eltávolítja a jelölőt a térképről. Ha ehelyett törölni kívánja a jelölőt, akkor távolítsa el a térképről, majd állítsa a jelölőt magára null
értékre.
Ha egy jelölőt szeretne kezelni jelölőkészletet, létre kell hoznia egy tömböt a jelölők megtartására. Ennek a tömbnek a segítségével hívhatja meg a setMap()
-t a tömb minden jelzőjén egymás után, amikor el kell távolítania a jelölőket. A jelölőket törölheti úgy, hogy eltávolítja őket a térképről, majd az “s length
tömböt 0
értékre állítja, amely eltávolítja az összes hivatkozást a markerek.
Példa megtekintése
Marker animálása
Animálhatja a jelzőket úgy, hogy dinamikus mozgást mutassanak különböző körülmények között. A jelölő animált, használja az “s animation
tulajdonságot, google.maps.Animation
típusú. A következő Animation
értékek támogatottak:
-
DROP
azt jelzi, hogy a jelölőnek le kell esnie a a térképet a végleges helyére, amikor először feltette a térképre. Az animáció megszűnik, amint a marker megpihent, ésanimation
visszaáll anull
értékre. Ezt az animációs típust általában aMarker
létrehozása során adják meg. -
BOUNCE
azt jelzi, hogy a jelölőnek be kell ugrania hely. A visszapattanó jelző addig folytatódik, amíganimation
tulajdonságát kifejezettennull
értékre állítja.
Ön animációt kezdeményezhet egy meglévő markeren úgy, hogy setAnimation()
hívja az Marker
objektumra.
Ha sok jelölője van , lehet, hogy nem akarja egyszerre a térképre dobni őket. Használhatja a setTimeout()
elemet a jelölők animációinak elhelyezéséhez az alábbiak szerint:
function drop() { for (var i =0; i markerArray.length; i++) { setTimeout(function() { addMarkerMethod(); }, i * 200); }}
Példa megtekintése
Jelölőkép testreszabása
Ha betűt vagy számot szeretne megjeleníteni a jelölőn, használhat jelölőcímkét.Ha nagyobb testreszabásra van szükség, definiálhat egy ikont, amelyet megjelenít az alapértelmezett jelölő kép helyett. Az ikon meghatározása számos olyan tulajdonság beállításával jár, amelyek meghatározzák a marker vizuális viselkedését.
Az alábbi szakaszok jelölő címkéket, egyszerű ikonokat, összetett ikonokat és szimbólumokat (vektoros ikonokat) írnak le. h3> Jelzőcímkék
A jelölőcímke egy betű vagy szám, amely a jelölőn belül jelenik meg. Az ebben a szakaszban található marker képen egy jelölőcímke látható, rajta a “B” betűvel. Megadhat egy jelölő címkét karakterláncként vagy MarkerLabel
objektumként, amely tartalmaz egy karakterláncot és más címke tulajdonságokat.
Jelző létrehozásakor megadhat egy label
tulajdonság az MarkerOptions
objektumban. Alternatív megoldásként felhívhatja a setLabel()
-t a Marker objektumon a címke beállításához egy meglévő jelölőn.
A következő példa címkézett markereket jelenít meg, amikor a felhasználó rákattint a térképre :
Egyszerű ikonok
A legalapvetőbb esetben egy ikon jelezheti a használni kívánt képet az alapértelmezett Google Maps nyomógomb ikon helyett. Ilyen ikon megadásához állítsa az “s icon
jelölőt egy kép URL-jére. A Maps JavaScript API automatikusan méretezi az ikont.
Komplex ikonok
Érdemes összetett alakzatokat megadnia a kattintható régiók megjelölésére, és meg kell határoznia, hogy az ikonoknak hogyan kell megjelenniük a többi fedvényhez képest (azok “sorrendje”). Az így megadott ikonoknak be kell állítaniuk a icon
tulajdonságok egy Icon
típusú objektumhoz.
Icon
objektumok definiálják egy képet. Meghatározzák az ikon size
ikont, az ikon origin
ikont is (ha a kívánt kép egy nagyobb kép része kép például egy sprite-ben), és a anchor
ahol az ikon hotspotját kell elhelyezni (ami az eredeten alapul).
Ha egyéni jelölővel ellátott címkét használ, a labelOrigin
tulajdonsággal elhelyezheti a címkét a objektum.
MarkerImage
objektumok konvertálása Icon
A Maps JavaScript API 3.10-es verziójáig az összetett ikonok MarkerImage
objektumok voltak. A Icon
objektum literál hozzá lett adva a 3.10-es verzióhoz, és a MarkerImage
-et váltja fel a 3.11-es verziótól kezdve. A Icon
objektum literálok ugyanazokat a paramétereket támogatják, mint a MarkerImage
, lehetővé téve a MarkerImage
konvertálását a Icon
fájlba a konstruktor eltávolításával, az előző paraméterek beburkolásával a {}
“s fájlokba és az egyes paraméterek nevének hozzáadásával. Például:
válik
szimbólummá
A raszteres képek mellett egy marker támogatja a Symbols
nevű vektorutak megjelenítését . Egy vektoros útvonal megjelenítéséhez adjon át egy Symbol
objektum literált a kívánt elérési úttal a “s icon
marker tulajdonsághoz. Használhatja a google.maps.SymbolPath egyik előre definiált útvonalát, vagy meghatározhat egy egyéni útvonalat az SVG elérési útvonal jelölésével.
További információért lásd a szimbólumok dokumentációját.
Készítsen egy jelölővel húzható
Ha lehetővé teszi a felhasználók számára, hogy jelölőt húzzanak a térkép másik helyére, állítsák a draggable
értéket true
További jelölő testreszabás
Teljesen testreszabott jelölővel kapcsolatban lásd a testreszabott előugró példát.