Latest web development tutorials

Google Maps события

Нажмите на маркер, чтобы изменить масштаб изображения - связывание на Google карте событий.


Нажмите на маркер Увеличить карту

Мы до сих пор используют бумажную карту с помощью Лондона.

Направляйте пользователей для достижения при нажатии на маркер функции масштабирования (масштаб карты нажатии маркера события связывания).

Код выглядит следующим образом:

примеров

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

Попробуйте »


При нажатии на маркер, чтобы открыть информационное окно.

Нажмите на маркер, чтобы отобразить текст в окне сообщений:

примеров

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

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

Попробуйте »


Установите этикетку и информацию тегов для каждого открытого окна

Реализация окна, когда пользователь нажимает на карте

Пользователи нажимают на карте к функции позиции placeMarker () на указанном месте, чтобы поместить маркер, и всплывающее окно с сообщением:

примеров

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

Попробуйте »


Google Maps - Руководство события

API Карт Google Справочное руководство .