Creative Saplings

Jelölők

december 17, 2020
No Comments

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ő) egy LatLng értéket határoz meg, amely azonosítja a marker kezdőhelyét. A LatLng lekérésének egyik módja a Geocoding szolgáltatás használata.
  • map (opcionális) megadja a Map 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 “s setMap() 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, és animation visszaáll a null értékre. Ezt az animációs típust általában a Marker 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íg animation tulajdonságát kifejezetten null é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.

Articles
Previous Post

Vigyázzon az egészségére: Útmutató tinédzsereknek

Next Post

Rákos főzés

Vélemény, hozzászólás? Kilépés a válaszból

Legutóbbi bejegyzések

  • A világ legjobb fotóiskolái, 2020
  • A szuverén polgárok kormányellenes filozófiájukat viszik az utakra
  • Stukkó javítási költség útmutató
  • Muckrakers (Magyar)
  • Precíziós onkológia

Archívum

  • 2021 február
  • 2021 január
  • 2020 december
  • 2020 november
  • 2020 október
  • 2020 szeptember
  • 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.