İş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çilerin nasıl kullanılacağı gösterilmektedir. Gelişmiş işaretçilerle yüksek performanslı işaretçiler oluşturup özelleştirebilir, DOM tıklama etkinliklerine ve klavye girişine yanıt veren erişilebilir işaretçiler oluşturabilirsiniz. Gelişmiş işaretçiler, daha da ayrıntılı özelleştirme için tamamen özel işaretçiler oluşturma olanağı dahil olmak üzere özel HTML ve CSS kullanımını destekler. 3D uygulamalarda, bir işaretçinin göründüğü rakımı kontrol edebilirsiniz. Gelişmiş işaretçiler, hem kafes hem de vektör haritalarda 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ık rengini özelleştirin ve işaretçi boyutunu ayarlayın.

Bazı özelleştirilmiş işaretçileri 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 ayırt edici etkileşimli işaretçiler ve animasyonlar oluşturmak için özel HTML ve CSS kullanın.

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

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

click etkinlik işleyici ekleyerek bir işaretçinin tıklamalara ve klavye etkinliklerine yanıt vermesini sağlayın.

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çinin rakımını ve çarpışma davranışını ayarla

İşaretçinin rakımını 3D harita öğeleriyle doğru şekilde görünmesi için ayarlayın ve bir işaretçinin başka bir işaretçi ya da harita etiketiyle çakıştığında nasıl davranması gerektiğini belirtin. İşaretçi rakımı yalnızca vektör haritalarında desteklenir.

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

Sonraki adım