توضح لك هذه الصفحة كيفية التحكم في الجوانب التالية من العلامات المتقدمة:
- تعيين سلوك التصادم لعلامة
- ضبط ارتفاع العلامة
- التحكم في رؤية العلامة حسب مستوى تكبير/تصغير الخريطة
تعيين سلوك التصادم لعلامة
يتحكم سلوك التصادم في كيفية عرض العلامة في حالة تصادمها (تداخل) بعلامة أخرى. لا يتم دعم سلوك التصادم إلا في خرائط المتجهات.
لضبط سلوك التصادم، يجب ضبط 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; } });