Maps

‫MapElement class

google.maps.MapElement class

‫MapElement הוא מחלקת משנה של HTMLElement שמשמשת לעיבוד מפות. אחרי טעינת הספרייה maps, אפשר ליצור מפה ב-HTML. לדוגמה:

‫
<gmp-map center="37.4220656,-122.0840897" zoom="10" map-id="DEMO_MAP_ID">
  <button slot="control-block-start-inline-end">Custom Control</button>
</gmp-map>
באופן פנימי, הוא משתמש ב-Map, שאפשר לגשת אליו באמצעות המאפיין MapElement.innerMap.

רכיב בהתאמה אישית:
<gmp-map center="lat,lng" heading-interaction-disabled internal-usage-attribution-ids="id1 id2" map-id="string" rendering-type="vector" tilt-interaction-disabled zoom="number"></gmp-map>

הכיתה הזו היא הרחבה של HTMLElement.

במחלקה הזו מיושם MapElementOptions.

אפשר להתקשר אל const {MapElement} = await google.maps.importLibrary("maps") כדי לקבל גישה.
מידע נוסף זמין במאמר בנושא ספריות ב-Maps JavaScript API.
MapElement
MapElement([options])
פרמטרים: 
center
סוג:  LatLng|LatLngLiteral optional
קו הרוחב וקו האורך במרכז המפה.
מאפיין HTML:
  • <gmp-map center="lat,lng"></gmp-map>
headingInteractionDisabled
סוג:  boolean optional
ברירת מחדל: false
האם המפה צריכה לאפשר למשתמשים לשלוט בכיוון המצלמה (סיבוב). האפשרות הזו רלוונטית רק אם המפה היא מפת וקטור. אם לא מגדירים את המזהה בקוד, ייעשה שימוש בהגדרת הענן של מזהה המפה (אם היא זמינה).
מאפיין HTML:
  • <gmp-map heading-interaction-disabled></gmp-map>
innerMap
סוג:  Map
הפניה ל-Map שרכיב MapElement משתמש בה באופן פנימי.
internalUsageAttributionIds
סוג:  Iterable<string> optional
ברירת מחדל: null
מוסיף מזהה שיוך שימוש לאתחול, שעוזר ל-Google להבין אילו ספריות ודוגמאות שימושיות למפתחים, כמו שימוש בספרייה של אשכולות סמנים. כדי לבטל את ההסכמה לשליחת מזהה שיוך השימוש, אפשר למחוק את המאפיין הזה או להחליף את הערך במחרוזת ריקה. יישלחו רק ערכים ייחודיים. יכול להיות שהמערכת תתעלם משינויים בערך הזה אחרי יצירת המופע.
מאפיין HTML:
  • <gmp-map internal-usage-attribution-ids="id1 id2"></gmp-map>
mapId
סוג:  string optional
מזהה המפה של המפה. אי אפשר להגדיר או לשנות את הפרמטר הזה אחרי שיוצרים מופע של מפה. אפשר להשתמש ב-Map.DEMO_MAP_ID כדי לנסות תכונות שנדרש להן מזהה מפה אבל לא נדרש להן הפעלה בענן.
מאפיין HTML:
  • <gmp-map map-id="string"></gmp-map>
renderingType
סוג:  RenderingType optional
ברירת מחדל: RenderingType.VECTOR
האם המפה צריכה להיות מפת רסטר או מפת וקטור. אי אפשר להגדיר או לשנות את הפרמטר הזה אחרי שיוצרים מופע של מפה. אם לא מוגדר ערך, הגדרת הענן של מזהה המפה תקבע את סוג העיבוד (אם זמין). חשוב לדעת שמפות וקטוריות לא זמינות לכל המכשירים והדפדפנים, ובמקרה הצורך המפה תהפוך למפת רסטר.
מאפיין HTML:
  • <gmp-map rendering-type="vector"></gmp-map>
  • <gmp-map rendering-type="raster"></gmp-map>
tiltInteractionDisabled
סוג:  boolean optional
ברירת מחדל: false
האם המפה צריכה לאפשר למשתמש לשלוט בהטיית המצלמה. האפשרות הזו רלוונטית רק אם המפה היא מפת וקטור. אם לא מגדירים את המזהה בקוד, ייעשה שימוש בהגדרת הענן של מזהה המפה (אם היא זמינה).
מאפיין HTML:
  • <gmp-map tilt-interaction-disabled></gmp-map>
zoom
סוג:  number optional
רמת הזום של המפה. ערכי הזום התקינים הם מספרים מאפס ועד רמת הזום המקסימלית הנתמכת. ערכי זום גדולים יותר מתאימים לרזולוציה גבוהה יותר.
מאפיין HTML:
  • <gmp-map zoom="number"></gmp-map>
control-block-end-inline-center
ממקם את הרכיב עם slot במיקום ControlPosition.BLOCK_END_INLINE_CENTER.
control-block-end-inline-end
ממקם את הרכיב עם slot במיקום ControlPosition.BLOCK_END_INLINE_END.
control-block-end-inline-start
ממקם את הרכיב עם slot במיקום ControlPosition.BLOCK_END_INLINE_START.
control-block-start-inline-center
ממקם את הרכיב עם slot במיקום ControlPosition.BLOCK_START_INLINE_CENTER.
control-block-start-inline-end
ממקם את הרכיב עם slot במיקום ControlPosition.BLOCK_START_INLINE_END.
control-block-start-inline-start
ממקם את הרכיב עם slot במיקום ControlPosition.BLOCK_START_INLINE_START.
control-inline-end-block-center
ממקם את הרכיב עם slot במיקום ControlPosition.INLINE_END_BLOCK_CENTER.
control-inline-end-block-end
ממקם את הרכיב עם slot במיקום ControlPosition.INLINE_END_BLOCK_END.
control-inline-end-block-start
ממקם את הרכיב עם slot במיקום ControlPosition.INLINE_END_BLOCK_START.
control-inline-start-block-center
ממקם את הרכיב עם slot במיקום ControlPosition.INLINE_START_BLOCK_CENTER.
control-inline-start-block-end
ממקם את הרכיב עם slot במיקום ControlPosition.INLINE_START_BLOCK_END.
control-inline-start-block-start
ממקם את הרכיב עם slot במיקום ControlPosition.INLINE_START_BLOCK_START.
default
אפשר ליצור רכיבים לשימוש חוזר סביב רכיבי האינטרנט של Maps JavaScript, כמו AdvancedMarkerElement, באמצעות רכיבים בהתאמה אישית. כברירת מחדל, כל רכיב בהתאמה אישית שמוסיפים ישירות ל-MapElement ימוקם ויוצג ב-MapPanes.overlayMouseTarget. עם זאת, יכול להיות שרכיבי האינטרנט של Maps JavaScript API יועברו מחדש לחריצים הפנימיים של MapElement.
BetaaddEventListener
addEventListener(type, listener[, options])
פרמטרים: 
  • ‫type:  string מחרוזת שרגישה לאותיות רישיות ומייצגת את סוג האירוע להאזנה.
  • ‫listener:  EventListener|EventListenerObject האובייקט שמקבל את ההתראה. הערך צריך להיות פונקציה או אובייקט עם השיטה handleEvent
  • options:  boolean|AddEventListenerOptions optional אפשרויות אירועים מותאמים אישית תומכים רק ב-capture וב-passive.
ערך מוחזר:  void
מגדיר פונקציה שתופעל בכל פעם שהאירוע שצוין מועבר ליעד. מידע נוסף זמין בהגדרה של addEventListener.
BetaremoveEventListener
removeEventListener(type, listener[, options])
פרמטרים: 
  • ‫type:  string מחרוזת שמציינת את סוג האירוע שלגביו רוצים להסיר את מאזין האירועים.
  • ‫listener:  EventListener|EventListenerObject ה-event listener של הגורם המטפל באירועים שרוצים להסיר מיעד האירוע.
  • options:  boolean|EventListenerOptions optional אפשרויות
ערך מוחזר:  void
מסירה מהיעד event listener שנרשם קודם באמצעות addEventListener. מידע נוסף זמין במאמר בנושא removeEventListener.
gmp-zoomchange
function(event)
ארגומנטים: 
האירוע הזה מופעל כשמאפיין הזום של המפה משתנה.

‫MapElementOptions interface

google.maps.MapElementOptions ממשק