Google Maps События

Нажмите на маркер, чтобы увеличить - прикрепить обработчики событий Google Maps.

Нажмите на маркер, чтобы Увеличить

Мы по-прежнему использовать карту с предыдущей страницы: карта с центром в Лондоне, Англия.

Теперь мы хотим, чтобы увеличить масштаб, когда пользователь нажимает на маркер (Придаем обработчик событий к маркеру, который масштабирует карту при нажатии).

Здесь вы добавили код:

пример

// Zoom to 9 when clicking on marker
google.maps.event.addListener(marker,'click',function() {
map.setZoom(9);
map.setCenter(marker.getPosition());
});

Попробуй сам "

Мы зарегистрироваться для получения уведомлений о событиях с помощью addListener() обработчик событий. Этот метод принимает объект, событие, чтобы прослушивать и функцию для вызова при наступлении указанного события.

Пан Назад к маркеру

Здесь мы добавим обработчик события к карте изменения к свойству «центра» и прокручивать карту обратно к маркеру через 3 секунды на center_changed события:

пример

google.maps.event.addListener(map,'center_changed',function() {
window.setTimeout(function() {
map.panTo(marker.getPosition());
},3000);
});

Попробуй сам "

Открыть InfoWindow При нажатии на маркер

Нажмите на маркер, чтобы показать InfoWindow с текстом:

пример

var infowindow = new google.maps.InfoWindow({
content:"Hello World!"
});

google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map,marker);
});

Попробуй сам "

Установить Маркеры и Open InfoWindow для каждого маркера

Запуск функции, когда пользователь нажимает на карте.

placeMarker() функция помещает маркер , где пользователь щелкнул, и показывает InfoWindow с широт и долгот маркера:

пример

google.maps.event.addListener(map, 'click', function(event) {
placeMarker(event.latLng);
});

function placeMarker(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);
}

Попробуй сам "