Gelişmiş işaretçileri ayarlamak için aşağıdaki adımları uygulayın.
Bir API anahtarı alma ve Maps JavaScript API'yi etkinleştirme
Gelişmiş işaretçileri kullanmadan önce bir Cloud bir faturalandırma hesabı içeren bir proje ve Maps JavaScript API'yi etkin. Daha fazla bilgi için Google Cloud projenizi oluşturma başlıklı makaleye göz atın.
Harita kimliği oluşturma
Yeni bir harita kimliği oluşturmak için Cloud özelleştirme bölümündeki adımları uygulayın. Harita türünü JavaScript olarak ayarlayın ve Vektör veya Raster seçeneğini belirleyin.
Harita başlatma kodunuzu güncelleme
Bunun için az önce oluşturduğunuz harita kimliği gerekir. Haritalar'da bulabilirsiniz. Yönetim sayfasını ziyaret edin.
Gelişmiş işaretçi kitaplığını
async
içinden yükleyin işlevini kullanın:const { AdvancedMarkerElement } = await google.maps.importLibrary("marker") as google.maps.MarkerLibrary;
mapId
özelliğini kullanarak haritayı somutlaştırırken bir harita kimliği sağlayın. Bu, sağladığınız bir harita kimliği veyaDEMO_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 bir harita kimliği gerekir. Harita kimliği eksikse gelişmiş işaretçiler yüklenemez. Sorun giderme adımı olarak
harita özelliğine abone olmak için bir mapcapabilities_changed
dinleyici ekleyebilirsiniz
anlamına gelir. Harita özellikleri isteğe bağlıdır ve yalnızca test ve sorun giderme amacıyla veya çalışma zamanında yedek olarak 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. } });