Fügen Sie bei Klicken auf Google Map einen Marker hinzu

Es fällt mir überraschend schwer, ein sehr einfaches Beispiel dafür zu finden, wie man einer Google Map Markierungen hinzufügt, wenn ein Nutzer auf die Karte klickt.

Ich habe mich in den letzten Stunden umgesehen und die Google Maps API-Dokumentation konsultiert. Ich würde mich über Hilfe freuen!

Nach viel weiterer Recherche gelang es mir, eine Lösung zu finden.

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

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

Im Jahr 2017 lautet die Lösung:

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

Dies ist tatsächlich eine dokumentierte Funktion und kann hier gefunden werden

// 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, Damit der Benutzer nur einmal hinzufügen und den Marker verschieben kann; Sie können die Markierung beim ersten Klicken setzen und dann bei nachfolgenden Klicks einfach die Position ändern.

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

Derzeit ist die Methode zum Hinzufügen des Listeners zur Karte

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

Und nicht

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

Referenz

1. Deklarieren Sie zuerst den Marker:

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

2. Rufen Sie die Methode auf, um die Markierung beim Klicken zu zeichnen:

this.placeMarker(coordinates, this.map);

3. Definieren Sie die Funktion:

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