Tambahkan penanda ke Google Map di Klik


87

Saya secara mengejutkan berjuang untuk menemukan contoh yang sangat sederhana tentang bagaimana menambahkan penanda ke Peta Google ketika pengguna mengklik kiri pada peta.

Saya telah melihat-lihat selama beberapa jam terakhir, dan membaca dokumentasi Google Maps API, dan sangat menghargai bantuan!

Jawaban:


169

Setelah penelitian lebih lanjut, saya berhasil menemukan solusinya.

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

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

7
Bisakah kita membuat pengguna hanya dapat menambahkan sekali? dan pindahkan penanda?
Chaibi Alaa

Plase berikan tautan sampel
Sopo

43

Di tahun 2017, solusinya adalah:

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

20

Ini sebenarnya adalah fitur yang didokumentasikan, dan dapat ditemukan di sini

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

14

@Chaibi Alaa, Untuk membuat pengguna hanya dapat menambahkan sekali, dan memindahkan penanda; Anda dapat mengatur penanda pada klik pertama dan kemudian mengubah posisi pada klik berikutnya.

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

6

Saat ini metode untuk menambahkan pendengar ke peta adalah

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

Dan tidak

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

Referensi


0
  1. Pertama-tama deklarasikan markernya:
this.marker = new google.maps.Marker({
   position: new google.maps.LatLng(12.924640523603115,77.61965398949724),
   map: map
});
  1. Panggil metode untuk memplot penanda saat diklik:
this.placeMarker(coordinates, this.map);
  1. Tentukan fungsinya:
placeMarker(location, map) {
    var marker = new google.maps.Marker({
        position: location,
        map: map
    });
    this.markersArray.push(marker);
}
Dengan menggunakan situs kami, Anda mengakui telah membaca dan memahami Kebijakan Cookie dan Kebijakan Privasi kami.
Licensed under cc by-sa 3.0 with attribution required.