Başlama

Platform seçin: Android iOS JavaScript

Gelişmiş işaretçileri ayarlamak için aşağıdaki adımları uygulayın.

API anahtarı alma ve Maps JavaScript API'yi etkinleştirme

Gelişmiş işaretçileri kullanmadan önce faturalandırma hesabı olan bir Cloud projeniz ve Maps JavaScript API etkinleştirilmiş olmalıdır. Daha fazla bilgi için Google Cloud projenizi ayarlama başlıklı makaleyi inceleyin.

API anahtarı alma

Harita kimliği oluşturma

Yeni bir harita kimliği oluşturmak için Bulut özelleştirme bölümündeki adımları uygulayın. Harita türünü JavaScript olarak ayarlayın ve Vektör veya Kafes seçeneğini belirleyin.

Vektör harita kimliği oluşturma

Harita başlatma kodunuzu güncelleme

Bunun için yeni oluşturduğunuz harita kimliği gerekir. Bu bilgiyi Haritalar Yönetimi sayfanızda bulabilirsiniz.

  1. Maps JavaScript API'yi yükleyin.

  2. Gerekli olduğunda async işlevinden gelişmiş işaretçi kitaplığını yükleyin:

    const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
  3. mapId özelliğini kullanarak haritayı oluşturduğunuzda bir harita kimliği sağlayın. Bu, sizin sağladığınız bir harita kimliği veya DEMO_MAP_ID olabilir.

    const map = new
    google.maps.Map(document.getElementById('map'), {
      center: {lat: -34.397, lng: 150.644},
      zoom: 8,
      mapId: 'YOUR_MAP_ID'
    });

Harita özelliklerini kontrol etme (isteğe bağlı)

Gelişmiş işaretçiler için harita kimliği gerekir. Harita kimliği eksikse gelişmiş işaretçiler yüklenemez. Sorun giderme adımı olarak, harita özelliği değişikliklerine abone olmak için mapcapabilities_changed dinleyicisi ekleyebilirsiniz. Harita Özellikleri'ni kullanmak isteğe bağlıdır ve yalnızca test ve sorun giderme amaçlarıyla veya çalışma zamanı geri dönüşü amacıyla kullanılması önerilir.

// 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.
  }
});

Sonraki adımlar

Haritaya işaretçi ekleme