Başlama

Platform seçin: Android iOS JavaScript

Gelişmiş işaretçilerle kurulum yapmak için aşağıdaki adımları uygulayın.

Bir API anahtarı alın ve Maps JavaScript API'yi etkinleştirin

Gelişmiş işaretçileri kullanmadan önce faturalandırma hesabı olan bir Cloud projesine sahip olmanız ve Maps JavaScript API'nin etkinleştirilmiş olması gerekir. Daha fazla bilgi edinmek için Google Cloud projenizi oluşturma başlıklı makaleyi inceleyin.

API anahtarı alma

Harita kimliği oluşturun

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

Vektör haritası kimliği oluştur

Harita ilk kullanıma hazırlama kodunuzu güncelleme

Bu işlem, az önce oluşturduğunuz harita kimliğini gerektirir. Bunu Haritalar Yönetimi sayfanızda bulabilirsiniz.

  1. Haritalar JavaScript API'sini yükleyin.

  2. Gerektiğinde gelişmiş işaretçi kitaplığını bir async işlevinden yükleyin:

    const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;

  3. mapId özelliğini kullanarak haritayı somutlaştırırken harita kimliği sağlayın. Bu, 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 edin (isteğe bağlı)

Gelişmiş işaretçiler için harita kimliği gerekir. Harita kimliği eksikse veya geçersiz bir harita kimliği iletilmişse gelişmiş işaretçiler yüklenemez. Sorun giderme adımı olarak, harita özelliği değişikliklerine abone olması için bir mapcapabilities_changed işleyici ekleyebilirsiniz. Bu, aşağıdaki koşulların karşılanıp karşılanmadığını gösterir:

  • Geçerli bir harita kimliği kullanılıyor.
  • Vektör haritası gerektiren özellikler kullanılıyorsa harita kimliği bir vektör haritasıyla ilişkilendirilir.

Harita Özellikleri'nin kullanımı isteğe bağlıdır ve yalnızca test etme ile sorun giderme amacıyla veya çalışma zamanı yedeği için ö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

Varsayılan gelişmiş işaretçi oluşturma