Tıklamayla Google Haritasına işaretçi ekleyin

Bir kullanıcı haritayı tıkladığında bir Google Haritasına nasıl işaretçi (ler) ekleneceğine dair çok basit bir örnek bulmakta şaşırtıcı bir şekilde mücadele ediyorum.

Son birkaç saattir etrafa baktım ve Google Haritalar API belgelerine baktım ve biraz yardım almaktan memnun olurum!

Daha fazla araştırmadan sonra bir çözüm bulmayı başardım.

google.maps.event.addListener(map, 'click', function(event) {
   placeMarker(event.latLng);
});

function placeMarker(location) {
    var marker = new google.maps.Marker({
        position: location, 
        map: map
    });
}

2017'de çözüm şudur:

map.addListener('click', function(e) {
    placeMarker(e.latLng, map);
});

function placeMarker(position, map) {
    var marker = new google.maps.Marker({
        position: position,
        map: map
    });
    map.panTo(position);
}

Bu aslında belgelenmiş bir özelliktir ve burada bulunabilir

// This event listener calls addMarker() when the map is clicked.
  google.maps.event.addListener(map, 'click', function(e) {
    placeMarker(e.latLng, map);
  });

  function placeMarker(position, map) {
    var marker = new google.maps.Marker({
      position: position,
      map: map
    });  
    map.panTo(position);
  }

@Chaibi Alaa, Kullanıcının yalnızca bir kez ekleyebilmesi ve işaretleyiciyi hareket ettirebilmesi için; İşaretçiyi ilk tıklamada ayarlayabilir ve ardından yalnızca sonraki tıklamalarda konumu değiştirebilirsiniz.

var marker;

google.maps.event.addListener(map, 'click', function(event) {
   placeMarker(event.latLng);
});


function placeMarker(location) {

    if (marker == null)
    {
          marker = new google.maps.Marker({
             position: location,
             map: map
          }); 
    } 
    else 
    {
        marker.setPosition(location); 
    } 
}

Şu anda, dinleyiciyi haritaya ekleme yöntemi

map.addListener('click', function(e) {
    placeMarker(e.latLng, map);
});

Ve yok

google.maps.event.addListener(map, 'click', function(e) {
    placeMarker(e.latLng, map);
});

Referans

1. Önce işaretçiyi beyan edin:

this.marker = new google.maps.Marker({
   position: new google.maps.LatLng(12.924640523603115,77.61965398949724),
   map: map
});

2. Tıklamadaki işaretleyiciyi çizmek için yöntemi çağırın:

this.placeMarker(coordinates, this.map);

3. İşlevi tanımlayın:

placeMarker(location, map) {
    var marker = new google.maps.Marker({
        position: location,
        map: map
    });
    this.markersArray.push(marker);
}