Google Maps Events
Щелкните маркер, чтобы увеличить-присоедините обработчики событий к картам Google.
Нажмите на маркер, чтобы увеличить
Мы все еще используем карту с предыдущей страницы: карта, сосредоточенная на Лондоне, Англия.
Теперь мы хотим, чтобы увеличить, когда пользователь щелкает по маркеру (мы прикрепляем обработчик событий к маркеру, который увеличивает карту при щелчке).
Вот добавленный код:
Пример
// Zoom to 9 when clicking on marker
google.maps.event.addListener(marker,'click',function() {
map.setZoom(9);
map.setCenter(marker.getPosition());
});
Мы регистрируем уведомления о событиях с помощью обработчика событий AddListener (). Этот метод принимает объект, событие для прослушивания и функцию для вызова при возникновении указанного события.
Панорамирование обратно к маркеру
Здесь мы сохраняем изменения масштаба и панорамирование карты обратно через 3 секунды:
Пример
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);
});
Открыть всплывающее окно при нажатии на маркер
Нажмите на маркер, чтобы показать всплывающее окно с текстом:
Пример
var infowindow = new google.maps.InfoWindow({
content:"Hello World!"
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});
Установить маркеры и открыть всплывающее окно для каждого маркера
Запустите функцию, когда пользователь щелкает по карте.
Функция Marker() помещает маркер, на который щелкнул пользователь, и показывает всплывающее окно с широтами и долготами маркера:
Пример
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);
}
