כדי להגדיר את הסמנים המתקדמים, פועלים לפי השלבים הבאים:
קבלת מפתח API והפעלת Maps JavaScript API
לפני שמשתמשים בסמנים מתקדמים, צריך פרויקט ב-Cloud עם חשבון לחיוב, וגם צריך להפעיל את Maps JavaScript API. למידע נוסף, קראו את המאמר הגדרת פרויקט ב-Google Cloud.
יצירת מזהה מפה
כדי ליצור מזהה מפה חדש, פועלים לפי השלבים המפורטים במאמר התאמה אישית של Cloud. מגדירים את סוג המפה ל-JavaScript ובוחרים באפשרות Vector או Raster.
עדכון קוד האתחול של המפה
לשם כך, צריך את מזהה המפה שיצרתם. ניתן למצוא את הפרופיל במפות Google שלך. ניהול.
טעינה של ספריית הסמנים המתקדמים מתוך
async
פונקציה זו במקרה הצורך:const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
צריך לספק מזהה מפה כשיוצרים את המפה באמצעות המאפיין
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. } });