Google Haritalar Olayları

İşareti tıkladığınızda zoom yap

Hala önceki sayfadaki haritayı kullanıyoruz: İngiltere Londrası merkezli harita.

Şimdi, kullanıcı işareti tıkladığında zoom yapmayı umuyoruz (işarete bir olay işleyicisi ekleyerek tıkladığında haritayı zoom yaparız).

Eklenen kod şu şekildedir:

Örnek

// İşareti tıkladığınızda 9'a zoom yap
google.maps.event.addListener(marker,'click',function() {
  harita.setZoom(9);
  harita.setCenter(marker.getPosition());
});

addListener() olay işleyicisini kullanarak olay bildirimleri kaydediyoruz. Bu yöntem, aşağıdaki parametreleri alır:

• Bir nesne
• Bir olay
• Bir fonksiyon, belirli bir olay meydana geldiğinde çağrılır

İşaret geri dön

Burada, zoom değişikliklerini kaydediyoruz ve 3 saniye sonra haritayı kaydırıyoruz:

Örnek

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

İşareti tıkladığınızda bilgi penceresi açılır

İşareti tıkladığınızda metin içeren bir bilgi penceresi görüntülenir:

Örnek

var infowindow = new google.maps.InfoWindow({
  içerik: "Merhaba Dünya!"
});
google.maps.event.addListener(marker, 'click', function() {
  infowindow.open(map,marker);
});

İşaretleri ayarlar ve her işaret için bilgi penceresi açar

Kullanıcı haritayı tıkladığında çalışır.

placeMarker() fonksiyonu, kullanıcı tıkladığı konumda bir işaret yerleştirir ve bu işaretin enlem ve boylamını içeren bir bilgi penceresi gösterir:

Örnek

google.maps.event.addListener(map, 'click', function(event) {
  placeMarker(map, event.latLng);
});
function placeMarker(map, location) {
  var marker = new google.maps.Marker({
    konum: location,
    harita: map
  });
  var infowindow = new google.maps.InfoWindow({
    içerik: 'Enlem: ' + location.lat() +
    'Uzunluk: ' + location.lng()
  });
  infowindow.open(map,marker);
}