نشانگرها

از نشانگرها برای جلب توجه کاربر به مکانی روی نقشه استفاده کنید. این راهنما نحوه استفاده و سفارشی‌سازی نشانگرها در نقشه‌های سه‌بعدی را نشان می‌دهد. شما می‌توانید شکل، اندازه و رنگ نشانگرها را علاوه بر ارتفاعی که در آن ظاهر می‌شوند، کنترل کنید. مثال زیر یک نشانگر ساده را نشان می‌دهد:

نقشه‌های سه‌بعدی در Maps جاوااسکریپت دو کلاس نشانگر مجزا ارائه می‌دهد که هر کدام برای کاربردهای خاصی بهینه شده‌اند. جدول زیر تفاوت‌ها و بده‌بستان‌های بین دو کلاس موجود را نشان می‌دهد:

قابلیت	MarkerElement	Marker3DElement
سفارشی‌سازی	بالا (از عناصر HTML سفارشی، APIهای انیمیشن اصلی و غیره پشتیبانی می‌کند)	کم (قابلیت تنظیم کمتر)
عملکرد	عملکرد تعاملی پایین‌تر (FPS با تعداد زیادی نشانگر کاهش می‌یابد)	عملکرد تعاملی بالاتر (بهینه‌سازی شده برای رندر مجموعه داده‌های بزرگ)
ظرفیت توصیه شده	عملکرد تعاملی قابل اعتماد تا حدود ۱۰۰۰ نشانگر	برای کار با بیش از ۱۰۰۰ ماژیک توصیه می‌شود

سفارشی کردن رنگ، مقیاس و تصویر آیکون

پس‌زمینه، علامت، رنگ حاشیه و اندازه نشانگر پیش‌فرض را سفارشی کنید.

نماد نشانگر پیش‌فرض را با یک منبع SVG سفارشی جایگزین کنید.

تنظیم ارتفاع نشانگر

شما می‌توانید با بیرون کشیدن نشانگر و تنظیم ارتفاع، ارتفاع نشانگر را تنظیم کنید.

نشانگرها را به رویدادهای کلیک و صفحه کلید پاسخ دهید

با اضافه کردن یک شنونده رویداد click کاری کنید که نشانگر به کلیک‌ها و رویدادهای صفحه‌کلید پاسخ دهد.

function initMap() {
  const map = new Map3DElement({
    center: { lat: 37.4690, lng: -122.1074, altitude: 0 },
    tilt: 67.5,
    range: 45000,
    mode: MapMode.HYBRID
  });

  const interactiveMarker = new google.maps.marker.Marker3DInteractiveElement({
    map,
    position: {lat: 37.4239163, lng: -122.0947209},
  });

  interactiveMarker.addEventListener('gmp-click', (event) => {
    // Handle the click event.
    // ...
  });
}

تنظیم رفتار برخورد نشانگر

مشخص کنید که یک نشانگر هنگام برخورد با یک نشانگر یا برچسب نقشه دیگر چگونه باید رفتار کند.

const marker = new Marker3DElement({
    position: {lat, lng},
    collisionBehavior: google.maps.CollisionBehavior.REQUIRED
});

عملکرد نشانگر

نشانگرهای HTML سفارشی ( MarkerElement ) عملکرد پایین‌تری نسبت به نشانگرهای سه‌بعدی استاندارد ( Marker3DElement ) ارائه می‌دهند. برای برنامه‌هایی با بیش از ۱۰۰۰ نشانگر، استفاده از کلاس Marker3dElement اکیداً توصیه می‌شود تا عملکرد بهینه تضمین شود.

مرحله بعدی

• اضافه کردن نشانگر