Dodaj znacznik do mapy Google za pomocą kliknięcia

87

Zaskakująco trudno mi znaleźć bardzo prosty przykład dodawania znacznika (ów) do mapy Google, gdy użytkownik kliknął mapę.

Rozejrzałem się przez ostatnie kilka godzin i zapoznałem się z dokumentacją interfejsu API Map Google i byłbym wdzięczny za pomoc!

Andre R.
źródło

Odpowiedzi:

169

Po wielu dalszych poszukiwaniach udało mi się znaleźć rozwiązanie.

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

function placeMarker(location) {
    var marker = new google.maps.Marker({
        position: location, 
        map: map
    });
}
Andre R.
źródło
7
czy możemy umożliwić użytkownikowi dodawanie tylko raz? i przesunąć znacznik?
Chaibi Alaa
proszę podać przykładowy link
Sopo
43

W 2017 roku rozwiązaniem jest:

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);
}
David Corral
źródło
20

W rzeczywistości jest to udokumentowana funkcja, którą można znaleźć tutaj

// 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);
  }
epson121
źródło
14

@Chaibi Alaa, aby użytkownik mógł dodawać tylko raz i przesuwać znacznik; Możesz ustawić znacznik przy pierwszym kliknięciu, a następnie po prostu zmieniać jego położenie przy kolejnych kliknięciach.

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); 
    } 
}
Ahmed Samy
źródło
6

Obecnie metodą dodawania nasłuchiwania do mapy byłoby

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

I nie

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

Odniesienie

JamesWorth
źródło
0
  1. Najpierw zadeklaruj znacznik:
this.marker = new google.maps.Marker({
   position: new google.maps.LatLng(12.924640523603115,77.61965398949724),
   map: map
});
  1. Wywołaj metodę wykreślania znacznika po kliknięciu:
this.placeMarker(coordinates, this.map);
  1. Zdefiniuj funkcję:
placeMarker(location, map) {
    var marker = new google.maps.Marker({
        position: location,
        map: map
    });
    this.markersArray.push(marker);
}
Midnight_ Thinkts
źródło