Acara Peta Google

Klik tanda untuk menycahkan

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

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

Ini adalah kode yang ditambahkan:

Contoh

// Menycahkan saat mengklik tanda 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

Geser kembali ke tanda

Di sini, kami menyimpan perubahan skala dan geser 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);
});

Buka jendela informasi saat mengklik tanda

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

Atur tanda dan buka jendela informasi untuk setiap tanda

Fungsi dijalankan saat pengguna mengklik peta.

letakkanMarker() fungsi akan menempatkan tanda di lokasi yang di klik pengguna dan menampilkan jendela informasi yang mengandung garis lintang dan lintang tanda:

Contoh

google.maps.event.addListener(peta, 'click', function(event) {
  letakkanMarker(peta, event.latLng);
});
function letakkanMarker(peta, lokasi) {
  var marker = new google.maps.Marker({
    posisi: lokasi,
    peta: peta
  });
  var infowindow = new google.maps.InfoWindow({
    konten: 'Garis lintang: ' + lokasi.lat() +
    '<br>Lintang: ' + lokasi.lng()
  });
  infowindow.open(map,marker);
}