نمای کلی نشانگرها

پلتفرم را انتخاب کنید: Android iOS JavaScript

از نشانگرها برای نمایش مکان های منفرد روی نقشه استفاده کنید. این راهنما نحوه استفاده از نشانگرهای پیشرفته را به شما نشان می دهد. با نشانگرهای پیشرفته می توانید نشانگرهای بسیار کارآمد را ایجاد و سفارشی کنید، و نشانگرهایی در دسترس بسازید که به رویدادهای کلیک DOM و ورودی صفحه کلید پاسخ می دهند. برای سفارشی‌سازی عمیق‌تر، نشانگرهای پیشرفته از استفاده از HTML و CSS سفارشی، از جمله توانایی ایجاد نشانگرهای کاملاً سفارشی پشتیبانی می‌کنند. برای برنامه های سه بعدی می توانید ارتفاعی را که در آن نشانگر ظاهر می شود کنترل کنید. نشانگرهای پیشرفته هم در نقشه های شطرنجی و هم بردار پشتیبانی می شوند (اگرچه برخی از ویژگی ها در نقشه های شطرنجی در دسترس نیستند). شناسه نقشه برای استفاده از نشانگرهای پیشرفته مورد نیاز است ( DEMO_MAP_ID را می توان استفاده کرد).

با نشانگرهای پیشرفته شروع کنید

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

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

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

نماد نشانگر پیش فرض را با یک تصویر SVG یا PNG سفارشی جایگزین کنید.

تصویری که نشانگرهای SVG سفارشی را نشان می‌دهد.

نشانگرهای HTML سفارشی ایجاد کنید

از HTML و CSS سفارشی برای ایجاد نشانگرهای تعاملی متمایز بصری و ایجاد انیمیشن استفاده کنید.

تصویری که نشانگر HTML سفارشی را نشان می دهد.

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

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

function initMap() {
  const map = new google.maps.Map(document.getElementById('map'), {
    center: {lat: 37.4239163, lng: -122.0947209},
    zoom: 17,
    mapId: 'DEMO_MAP_ID',
  });

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

  marker.addListener('click', ({domEvent, latLng}) => {
    const {target} = domEvent;
    // Handle the click event.
    // ...
  });
}

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

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

اسکرین شات نشانگر تنظیم ارتفاع را نشان می دهد.

گام بعدی