אני רוצה לנסות

כדי להגדיר באמצעות סמנים מתקדמים, צריך לפעול לפי השלבים הבאים.

קבלת מפתח API והפעלת ממשק JavaScript API של מפות Google

כדי להשתמש בסמנים מתקדמים, צריך פרויקט עם חשבון לחיוב, ו-Maps JavaScript API מופעל. למידע נוסף, קראו את המאמר הגדרת פרויקט ב-Google Cloud.

קבלת מפתח API

יצירת מזהה מפה

כדי ליצור מזהה מפה חדש, פועלים לפי השלבים הבאים: התאמה אישית של הענן. מגדירים את סוג המפה כ-JavaScript ובוחרים באפשרות Vector (וקטור) או רסטר.

עדכון הקוד של אתחול המפה

כדי לעשות את זה צריך את מזהה המפה שיצרתם. ניתן למצוא את הפרופיל במפות Google שלך. ניהול.

1. טוענים את Maps JavaScript API.

2. טעינה של ספריית הסמנים המתקדמים מתוך async פונקציה זו במקרה הצורך:

   const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
   

3. צריך לספק מזהה מפה כשיוצרים את המפה באמצעות המאפיין mapId. הוא יכול להיות מזהה המפה שסיפקתם, או DEMO_MAP_ID.

   const map = new
   google.maps.Map(document.getElementById('map'), {
     center: {lat: -34.397, lng: 150.644},
     zoom: 8,
     mapId: 'YOUR_MAP_ID'
   });

בדיקת יכולות המפה (אופציונלי)

סמנים מתקדמים דורשים מזהה מפה. אם מזהה המפה חסר, לא ניתן לטעון סמנים מתקדמים. בשלב של פתרון בעיות, אפשר להוסיף אוזן mapcapabilities_changed כדי להירשם ליכולות המפה שינויים. השימוש ביכולות של המפה הוא אופציונלי, ומומלץ רק לבדיקה. ופתרון בעיות, או למטרות חזרה למצב זמן ריצה.

// Optional: subscribe to map capability changes.
map.addListener('mapcapabilities_changed', () => {
  const mapCapabilities = map.getMapCapabilities();

  if (!mapCapabilities.isAdvancedMarkersAvailable) {
    // Advanced markers are *not* available, add a fallback.
  }
});

השלבים הבאים

יצירת סמן מתקדם שמוגדר כברירת מחדל