Google Haritalar Etkinlikleri
Yakınlaştırmak için İşaretçiye tıklayın
Hala önceki sayfadaki haritayı kullanıyoruz: Londra, İngiltere merkezli bir harita.
Şimdi, bir kullanıcı işaretçiyi tıkladığında yakınlaştırmak istiyoruz (tıklandığında haritayı yakınlaştıran bir işaretçiye bir olay işleyicisi ekliyoruz).
İşte eklenen kod:
Örnek
// Zoom to 9 when clicking on marker
google.maps.event.addListener(marker,'click',function() {
map.setZoom(9);
map.setCenter(marker.getPosition());
});
addListener() olay işleyicisini kullanarak olay bildirimleri için kaydoluruz. Bu yöntem, bir nesneyi, dinlenecek bir olayı ve belirtilen olay meydana geldiğinde çağrılacak bir işlevi alır.
İşaretçiye Döndür
Burada, yakınlaştırma değişikliklerini kaydedip 3 saniye sonra haritayı geri kaydırıyoruz:
Örnek
google.maps.event.addListener(marker,'click',function() {
var pos = map.getZoom();
map.setZoom(9);
map.setCenter(marker.getPosition());
window.setTimeout(function() {map.setZoom(pos);},3000);
});
İşaretçiye Tıklarken Bir InfoWindow Açın
Metin içeren bir bilgi penceresi göstermek için işaretçiye tıklayın:
Örnek
var infowindow = new google.maps.InfoWindow({
content:"Hello World!"
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
Her İşaretçi için İşaretleyicileri Ayarlayın ve InfoWindow'u Açın
Kullanıcı haritaya tıkladığında bir işlev çalıştırın.
placeMarker() işlevi, kullanıcının tıkladığı bir işaretçi yerleştirir ve işaretçinin enlem ve boylamları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({
position: location,
map: map
});
var infowindow = new google.maps.InfoWindow({
content: 'Latitude: ' + location.lat() +
'<br>Longitude: ' + location.lng()
});
infowindow.open(map,marker);
}