İşaretçilere genel bakış

Platform seçin: Android iOS JavaScript

Harita üzerinde tek tek konumları görüntülemek için işaretçileri kullanın. Bu kılavuzda, gelişmiş işaretçileri kullanabilirsiniz. Entegre oluşturmak ve özelleştirmek için kullanabileceğiniz, gelişmiş performans işaretçileri oluşturabilir ve DOM tıklama etkinliklerine yanıt veren erişilebilir işaretçiler oluşturabilirsiniz. ve klavye girişi. Daha da ayrıntılı özelleştirme için gelişmiş işaretçiler, özel HTML ve CSS kullanımını destekler, tamamen özel işaretçiler oluşturma olanağı dahil. 3D uygulamalar için bir işaretçinin göründüğü rakımı kontrol edebilirsiniz. Gelişmiş işaretçiler, hem kafes hem de vektör haritalarında desteklenir (ancak bazı özellikler kafes haritalarda kullanılamaz). Gelişmiş İşaretçileri kullanmak için harita kimliği gerekir (DEMO_MAP_ID kullanılabilir).

Gelişmiş işaretçileri kullanmaya başlama

Rengi, ölçeği ve simge resmini özelleştirin

Varsayılan işaretçinin arka planını, glifini ve kenarlığını özelleştirin ve işaretçi boyutunu ayarlayın.

Özelleştirilmiş birkaç işaretçiyi gösteren ekran görüntüsü.

Varsayılan işaretçi simgesini özel bir SVG veya PNG resmiyle değiştirin.

Özel SVG işaretçilerini gösteren ekran görüntüsü.

Özel HTML işaretçileri oluşturma

Görsel olarak özgün reklamlar oluşturmak için özel HTML ve CSS kullanın etkileşimli işaretçiler kullanabilir ve animasyonlar oluşturabilirsiniz.

Özel HTML işaretçisini gösteren ekran görüntüsü.

İşaretçilerin tıklama ve klavye etkinliklerine yanıt vermesini sağlayın

Bir işaretçinin, tıklama ve klavye etkinliklerine yanıt vermesini sağlamak için click etkinlik işleyicisi.

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

İşaretçi rakımını ve çarpışma davranışını ayarlayın

İşaretçinin rakımını doğru şekilde ayarlayarak 3D harita öğelerini kullanın ve bir işaretçi ile çakıştığında nasıl davranması gerektiğini belirtin başka bir işaretçi veya harita etiketi ekleyin. İşaretçi rakımı yalnızca vektör haritalarında desteklenir.

Rakım ayarlanmış bir işaretçiyi gösteren ekran görüntüsü.

Sonraki adım