Google Maps API V3: Как перейти к определенному маркеру снаружи карты?
У меня есть карта с двумя маркерами на нем.
Начальное представление карты только показывает один маркер, и я хочу предоставить ссылку рядом с картой, которая переместит карту в 2-й маркер при нажатии.
Вот демонстрация того, что я хочу, с помощью v2 API: http://arts.brighton.ac.uk/contact-university-of-brighton-faculty-of-arts (отмечают ссылки ниже карта),
Вот то, что я имею до сих пор:
Таким образом, то, что я хотел бы добавить, является ссылкой на marker2, перемещать карту приблизительно 50 с лишним мили, например. Second location.
Как я сделал бы это?
1 ответ
Используйте addDomListener для добавления события click к ссылке, которое переместит карту на этот маркер (вам также нужно будет добавить id к тегу ссылки, чтобы вы могли ссылаться на него в коде):
Edit: Set the event in a initialization function:
<head>
<script type="text/javascript">
function initialize() {
var myLatlng = new google.maps.LatLng(-34.397, 150.644);
var myOptions = {
zoom: 8,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var marker2 = new google.maps.Marker({ position: new google.maps.LatLng(51.5262405, -0.074549), map: map, title: 'my 2nd title'});
google.maps.event.addDomListener(document.getElementById("linkID"), "click", function(ev) {
map.setCenter(marker2.getPosition());
}
}
</script>
</head>
<body style="margin:0px; padding:0px;" onload="initialize()">
<a href="javascript:function() { return false; }" id="location2">Second place</a>
<div id="map_canvas" style="width:100%; height:100%"></div>
</body>