Acara Peta Google

mengklik tanda untuk menggandakan

kami masih menggunakan peta sebelumnya: peta yang berpusat di London, Inggris.

sekarang, kami ingin menggandakan saat pengguna mengklik tanda (kami menambahkan penanganan peristiwa ke tanda untuk menggandakan peta saat diklik).

ini adalah kode yang ditambahkan:

contoh

// mengklik tanda untuk menaikkan skala ke 9
google.maps.event.addListener(tanda,'click',function() {
  peta.setZoom(9);
  peta.setCenter(tanda.getPosition());
});

kami menggunakan penanganan peristiwa addListener() untuk mendaftarkan pemberitahuan peristiwa. Parameter yang diterima oleh metode ini adalah:

  • objek
  • peristiwa yang didengarkan
  • fungsi yang dipanggil saat peristiwa terjadi

pindah kembali ke tanda

di sini, kami menyimpan perubahan skala dan memindahkan peta setelah 3 detik:

contoh

google.maps.event.addListener(tanda,'click',function() {
  var pos = peta.getZoom();
  peta.setZoom(9);
  peta.setCenter(tanda.getPosition());
  window.setTimeout(function() {peta.setZoom(pos);},3000);
});

membuka jendela informasi saat mengklik tanda

mengklik tanda untuk menampilkan jendela informasi yang mengandung teks:

contoh

var infowindow = new google.maps.InfoWindow({
  konten: "Hello World!"
});
google.maps.event.addListener(tanda, 'click', function() {
  infowindow.open(map,marker);
});

mengatur tanda dan membuka jendela informasi untuk setiap tanda

melaksanakan fungsi saat pengguna mengklik peta.

letakPemarker() fungsi akan meletakkan tanda di lokasi yang dipilih pengguna dan menampilkan jendela informasi yang mengandung garis bujur dan garis lintang tanda:

contoh

google.maps.event.addListener(peta, 'click', function(event) {
  letakPemarker(peta, event.latLng);
});
function letakPemarker(peta, lokasi) {
  var marker = new google.maps.Marker({
    kedudukan: lokasi,
    peta: peta
  });
  var infowindow = new google.maps.InfoWindow({
    konten: ' latitude: ' + lokasi.lat() +
    '<br> longitud: ' + lokasi.lng()
  });
  infowindow.open(map,marker);
}