AdvancedMarkerElement class
google.maps.marker.AdvancedMarkerElement
class
extends HTMLElement
implements AdvancedMarkerElementOptions
library "marker"
הצגת מיקום במפה. שימו לב שצריך להגדיר את position כדי ש-AdvancedMarkerElement יוצג.
<gmp-advanced-marker anchor-left="string" anchor-top="string" gmp-clickable position="lat,lng" title="string"> </gmp-advanced-marker>
const {AdvancedMarkerElement} = await google.maps.importLibrary("marker");
יצרן | |
|---|---|
AdvancedMarkerElement |
AdvancedMarkerElement([options])פרמטרים:
יוצרת AdvancedMarkerElement עם האפשרויות שצוינו. אם מציינים מפה, ה-AdvancedMarkerElement מתווסף למפה בזמן היצירה. |
מאפיינים | |
|---|---|
anchorLeft
attr: anchor-left |
סוג:
string optionalברירת מחדל: "-50%"
ערך אחוז אורך CSS שמשמש להסטת נקודת העיגון של הסמן מהפינה השמאלית העליונה של הסמן. האפשרות הזו שימושית כשמשתמשים ברכיב חזותי עם נקודת עיגון שונה מהנקודה הרגילה במרכז התחתון של סמן ברירת המחדל.
מאפיין HTML: anchor-left="string" |
anchorTop
attr: anchor-top |
סוג:
string optionalברירת מחדל: "-100%"
ערך אחוז אורך CSS שמשמש להסטת נקודת העיגון של הסמן מהפינה השמאלית העליונה של הסמן. האפשרות הזו שימושית כשמשתמשים ברכיב חזותי עם נקודת עיגון שונה מהנקודה הרגילה במרכז התחתון של סמן ברירת המחדל.
מאפיין HTML: anchor-top="string" |
collisionBehavior |
סוג:
CollisionBehavior optional |
gmpClickable
attr: gmp-clickable |
סוג:
boolean optionalמאפיין HTML: gmp-clickable |
gmpDraggable |
סוג:
boolean optional |
map |
סוג:
Map optional |
position
attr: position |
סוג:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalמאפיין HTML:
|
title
attr: title |
סוג:
stringמאפיין HTML: title="string" |
zIndex |
סוג:
number optional |
readonly |
סוג:
HTMLElementהשדה הזה הוא לקריאה בלבד. רכיב ה-DOM שמגבה את התצוגה. |
|
סוג:
Node optional |
Methods | |
|---|---|
addListener |
addListener(eventName, handler)פרמטרים:
ערך מוחזר:
MapsEventListener רכיב event listener שנוצר.מוסיפה את פונקציית ה-listener הנתונה לשם האירוע הנתון במערכת האירועים של מפות Google. |
בירושה:
addEventListener,
removeEventListener
| |
אירועים | |
|---|---|
click |
function(event)ארגומנטים:
האירוע הזה מופעל כשלוחצים על הרכיב AdvancedMarkerElement.לא זמין עם addEventListener() (צריך להשתמש ב-gmp-click במקום זאת). |
drag |
function(event)ארגומנטים:
האירוע הזה מופעל שוב ושוב בזמן שהמשתמש גורר את AdvancedMarkerElement.לא זמין עם addEventListener(). |
dragend |
function(event)ארגומנטים:
|
dragstart |
function(event)ארגומנטים:
|
gmp-click |
function(event)ארגומנטים:
האירוע הזה מופעל כשלוחצים על הרכיב AdvancedMarkerElement. מומלץ להשתמש ב-addEventListener() (במקום ב-addListener()). |
ממשק AdvancedMarkerElementOptions
ממשק google.maps.marker.AdvancedMarkerElementOptions
אפשרויות ליצירת AdvancedMarkerElement.
מאפיינים | |
|---|---|
anchorLeft
אופציונלי |
סוג:
string optionalברירת מחדל: "-50%"
ערך אחוז אורך CSS שמשמש להסטת נקודת העיגון של הסמן מהפינה השמאלית העליונה של הסמן. האפשרות הזו שימושית כשמשתמשים ברכיב חזותי עם נקודת עיגון שונה מהנקודה הרגילה במרכז התחתון של סמן ברירת המחדל. |
anchorTop
אופציונלי |
סוג:
string optionalברירת מחדל: "-100%"
ערך אחוז אורך CSS שמשמש להסטת נקודת העיגון של הסמן מהפינה השמאלית העליונה של הסמן. האפשרות הזו שימושית כשמשתמשים ברכיב חזותי עם נקודת עיגון שונה מהנקודה הרגילה במרכז התחתון של סמן ברירת המחדל. |
collisionBehavior
אופציונלי |
סוג:
CollisionBehavior optionalרשימה שמציינת איך AdvancedMarkerElement אמור להתנהג כשהוא מתנגש עם AdvancedMarkerElement אחר או עם תוויות מפת הבסיס במפה וקטורית. הערה: התנגשות בין |
content
אופציונלי |
סוג:
Node optionalברירת המחדל:
PinElementרכיב ה-DOM שתומך ברכיב החזותי של AdvancedMarkerElement. הערה: הפונקציה |
gmpClickable
אופציונלי |
סוג:
boolean optionalברירת המחדל:
falseאם true, אפשר יהיה ללחוץ על AdvancedMarkerElement והוא יפעיל את האירוע gmp-click, והוא יהיה אינטראקטיבי למטרות נגישות (למשל, יאפשר ניווט במקלדת באמצעות מקשי החיצים). |
gmpDraggable
אופציונלי |
סוג:
boolean optionalברירת המחדל:
falseאם true, אפשר לגרור את AdvancedMarkerElement. הערה: אי אפשר לגרור את |
map
אופציונלי |
סוג:
Map optionalהמפה שבה יוצג AdvancedMarkerElement. המפה נדרשת כדי להציג את AdvancedMarkerElement, ואפשר לספק אותה על ידי הגדרת AdvancedMarkerElement.map אם היא לא סופקה במהלך הבנייה. |
position
אופציונלי |
סוג:
LatLng|LatLngLiteral|LatLngAltitude|LatLngAltitudeLiteral optionalמגדיר את המיקום של AdvancedMarkerElement. אפשר ליצור AdvancedMarkerElement בלי מיקום, אבל הוא לא יוצג עד שהמיקום שלו יסופק – למשל, על ידי פעולות או בחירות של המשתמש. אפשר לציין את המיקום של AdvancedMarkerElement באמצעות הגדרת AdvancedMarkerElement.position אם הוא לא צוין ב-constructor. הערה: |
title
אופציונלי |
סוג:
string optionalטקסט שמופיע כשמעבירים את העכבר מעל התמונה. אם צוין טקסט נגישות (למשל, לשימוש עם קוראי מסך), הוא יתווסף ל- AdvancedMarkerElement עם הערך שצוין. |
zIndex
אופציונלי |
סוג:
number optionalכל ה- AdvancedMarkerElement מוצגים במפה לפי ה-zIndex שלהם, כאשר ערכים גבוהים יותר מוצגים לפני AdvancedMarkerElement עם ערכים נמוכים יותר. כברירת מחדל, AdvancedMarkerElement מוצגים לפי המיקום האנכי שלהם במסך, כך שAdvancedMarkerElement נמוכים יותר מופיעים לפני AdvancedMarkerElement גבוהים יותר במסך. שילוב של סמנים עם zIndex מפורש וסמנים בלי יכול להוביל לתוצאות חזותיות לא צפויות. כדי להבטיח התנהגות צפויה, מומלץ להגדיר את zIndex לכל הסמנים או להשאיר אותו לא מוגדר. חשוב לזכור ש-zIndex משמש גם כדי לקבוע את העדיפות היחסית בין סמנים מתקדמים מסוג CollisionBehavior.OPTIONAL_AND_HIDES_LOWER_PRIORITY. ערך zIndex גבוה יותר מציין עדיפות גבוהה יותר. |
הכיתה AdvancedMarkerClickEvent
google.maps.marker.AdvancedMarkerClickEvent
class
extends Event
library "marker"
האירוע הזה נוצר מלחיצה על סמן מתקדם. אפשר לגשת למיקום של הסמן באמצעות event.target.position.
const {AdvancedMarkerClickEvent} = await google.maps.importLibrary("marker");
הכיתה PinElement
google.maps.marker.PinElement
class
extends HTMLElement
implements PinElementOptions
library "marker"
PinElement מייצג רכיב DOM שמורכב מצורה ומגליף. לצורה יש את אותו סגנון בועה כמו בברירת המחדל AdvancedMarkerElement או Marker3DElement. הגליף הוא רכיב DOM אופציונלי שמוצג בצורת הבלון. יחס הגובה-רוחב של PinElement עשוי להשתנות בהתאם לPinElement.scale שלו.
const {PinElement} = await google.maps.importLibrary("marker");
יצרן | |
|---|---|
PinElement |
PinElement([options])פרמטרים:
|
מאפיינים | |
|---|---|
background |
סוג:
string optionalצבע הרקע של צורת הסיכה. PinElementOptions.background. |
borderColor |
סוג:
string optionalצבע הגבול של צורת הסיכה. PinElementOptions.borderColor. |
glyphColor |
סוג:
string optionalהצבע של הגליף של הסיכה. PinElementOptions.glyphColor. |
glyphSrc |
סוג:
URL|string optionalמקור התמונה של הגליף שיוצג בסיכה. PinElementOptions.glyphSrc. |
glyphText |
סוג:
string optionalהטקסט שמוצג בסיכה. PinElementOptions.glyphText. |
scale |
סוג:
number optional |
readonly |
סוג:
HTMLElementהשדה הזה הוא לקריאה בלבד. רכיב ה-DOM שמגבה את התצוגה. |
|
|
Methods | |
|---|---|
בירושה:
addEventListener,
removeEventListener
|
הממשק PinElementOptions
ממשק google.maps.marker.PinElementOptions
אפשרויות ליצירת PinElement.
מאפיינים | |
|---|---|
background
אופציונלי |
סוג:
string optionalצבע הרקע של צורת הסיכה. תומך בכל ערך צבע ב-CSS. |
borderColor
אופציונלי |
סוג:
string optionalצבע הגבול של צורת הסיכה. תומך בכל ערך צבע ב-CSS. |
אופציונלי |
רכיב ה-DOM שמוצג בסיכה. |
glyphColor
אופציונלי |
סוג:
string optionalהצבע של הגליף. תומך בכל ערך צבע ב-CSS. |
glyphSrc
אופציונלי |
סוג:
URL|string optionalמקור התמונה של הגליף שיוצג בסיכה. |
glyphText
אופציונלי |
סוג:
string optionalהטקסט שמוצג בסיכה. |
scale
אופציונלי |
סוג:
number optionalברירת המחדל:
1קנה המידה של הסיכה. |