شروع کنید

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

برای راه اندازی نشانگرهای پیشرفته این مراحل را دنبال کنید.

یک کلید API دریافت کنید و Maps JavaScript API را فعال کنید

قبل از استفاده از نشانگرهای پیشرفته، به یک پروژه Cloud با یک حساب صورت‌حساب و فعال کردن Maps JavaScript API نیاز دارید. برای کسب اطلاعات بیشتر، به تنظیم پروژه Google Cloud خود مراجعه کنید.

یک کلید API دریافت کنید

یک شناسه نقشه ایجاد کنید

برای ایجاد شناسه نقشه جدید، مراحل سفارشی‌سازی Cloud را دنبال کنید. نوع Map را روی جاوا اسکریپت قرار دهید و گزینه Vector یا Raster را انتخاب کنید.

ایجاد شناسه نقشه برداری

کد اولیه نقشه خود را به روز کنید

این به شناسه نقشه ای نیاز دارد که به تازگی ایجاد کرده اید. می توانید آن را در صفحه مدیریت نقشه های شما پیدا کنید.

  1. Maps JavaScript API را بارگیری کنید .

  2. در صورت نیاز، کتابخانه نشانگرهای پیشرفته را از داخل یک تابع async بارگیری کنید:

    const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
    
  3. زمانی که نقشه را با استفاده از ویژگی 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.
  }
});

مراحل بعدی

یک نشانگر پیشرفته پیش فرض ایجاد کنید