בדף הזה מוסבר איך לשלוט בהיבטים הבאים של סמנים מתקדמים:
- הגדרת התנהגות התנגשות של סמן
- הגדרת גובה הסמן
- שליטה בנראות הסמן לפי רמת הזום במפה
הגדרת התנהגות התנגשות של סמן
התנהגות ההתנגשות קובעת את האופן שבו סמן יוצג אם הוא מתנגש (חופף) עם סמן אחר. התכונה 'התנהגות התנגשות' נתמכת רק במפות וקטורים.
כדי להגדיר התנהגות התנגשות, מגדירים את AdvancedMarkerElement.collisionBehavior
לאחת מהאפשרויות הבאות:
REQUIRED
: (ברירת מחדל) הסמן תמיד יוצג ללא קשר להתנגשות.OPTIONAL_AND_HIDES_LOWER_PRIORITY
הצגת הסמן רק אם הוא לא חופף לסימנים אחרים. אם שני סמנים מהסוג הזה חופפים, יוצג הסמנים עם הערךzIndex
הגבוה יותר. אם יש להם את אותוzIndex
, יוצג הקובץ שנמצא במיקום הנמוך יותר במסך האנכי.REQUIRED_AND_HIDES_OPTIONAL
תמיד להציג את הסמן ללא קשר להתנגשות, ולהסתיר את כל התוויות או הסימנים מסוגOPTIONAL_AND_HIDES_LOWER_PRIORITY
שיחפו על הסמן.
הדוגמה הבאה מציגה התנהגות התנגשות של סמן:
TypeScript
const advancedMarker = new AdvancedMarkerElement({ position: new google.maps.LatLng({ lat, lng }), map, collisionBehavior: collisionBehavior, });
JavaScript
const advancedMarker = new AdvancedMarkerElement({ position: new google.maps.LatLng({ lat, lng }), map, collisionBehavior: collisionBehavior, });
הגדרת הגובה של הסמן
במפות וקטוריות, אפשר להגדיר את הגובה שבו יופיע הסמן. אפשר להשתמש באפשרות הזו כדי שהסמנים יופיעו בצורה נכונה ביחס לתוכן של מפה תלת-ממדית. כדי להגדיר את הגובה של סמן, מציינים LatLngAltitude
כערך של האפשרות MarkerView.position
:
TypeScript
const pin = new PinElement({ background: '#4b2e83', borderColor: '#b7a57a', glyphColor: '#b7a57a', scale: 2.0, }); const markerView = new AdvancedMarkerElement({ map, content: pin.element, // Set altitude to 20 meters above the ground. position: { lat: 47.65170843460547, lng: -122.30754, altitude: 20 } as google.maps.LatLngAltitudeLiteral, });
JavaScript
const pin = new PinElement({ background: "#4b2e83", borderColor: "#b7a57a", glyphColor: "#b7a57a", scale: 2.0, }); const markerView = new AdvancedMarkerElement({ map, content: pin.element, // Set altitude to 20 meters above the ground. position: { lat: 47.65170843460547, lng: -122.30754, altitude: 20 }, });
שליטה בנראות הסמן לפי רמת הזום במפה
רואים את השינוי בחשיפה של הסמנים (מתחילים בהקטנת התצוגה):
כדי לשלוט בחשיפה של עט סימון מתקדם, יוצרים מכשירי האזנה
zoom_changed
ומוסיפים פונקציה מותנית כדי להגדיר את AdvancedMarkerElement.map
לערך null
אם מרחק התצוגה חורג מהרמה שצוינה, כמו בדוגמה הבאה:
TypeScript
map.addListener('zoom_changed', () => { const zoom = map.getZoom(); if (zoom) { // Only show each marker above a certain zoom level. marker01.map = zoom > 14 ? map : null; marker02.map = zoom > 15 ? map : null; marker03.map = zoom > 16 ? map : null; marker04.map = zoom > 17 ? map : null; } });
JavaScript
map.addListener("zoom_changed", () => { const zoom = map.getZoom(); if (zoom) { // Only show each marker above a certain zoom level. marker01.map = zoom > 14 ? map : null; marker02.map = zoom > 15 ? map : null; marker03.map = zoom > 16 ? map : null; marker04.map = zoom > 17 ? map : null; } });