Чтобы при нажатии на маркер Google Maps отображался определенный элемент div
Я довольно новичок в JavaScript, и яЯ учусь по ходу дела, извините, если это просто.
У меня есть набор маркеров, отображаемых на карте, они загружаются из массива и отображаются с помощью функции. То, что я хочу сделать, - это создать всплывающий элемент div, связанный с маркером, по которому щелкнули. При щелчке другого маркера предыдущий div закрывается и открывается новый div.
Это то, что я до сих пор, чтобы понять, что яя делаю.
Я предполагаю, что хотел бы написать функцию, которая говорит ... »Если 'Маркер А ' нажал, откройDiv A ' и если 'Маркер Б ' нажата покаМаркер А ' открыт, потом закройDiv A ' и открытьDiv B '.
Вот's мой JavaScript
var markers = [
['Saving Grace', 43.652659,-79.412284],
['Starving Artist', 43.660281,-79.443570]
];
// Standard google maps function
function initialize() {
var myLatlng = new google.maps.LatLng(43.655826,-79.383116);
var image = 'http://www.brunchtoronto.com/images/marker-blue.png';
var myOptions = {
zoom: 13,
center: myLatlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
// Current Toggle function which displays Feature Box when marker is clicked
function opendiv() {
var ele = document.getElementById("div-feature");
ele.style.display = "block";
}
var infowindow = new google.maps.InfoWindow();
var marker, i;
for (i = 0; i < markers.length; i++) {
marker = new google.maps.Marker({
position: new google.maps.LatLng(markers[i][1], markers[i][2]),
map: map,
icon: image
});
google.maps.event.addListener(marker, 'click', (function(marker, i) {
return function() {
map.panTo(marker.getPosition());
infowindow.setContent(markers[i][0]);
infowindow.open(map, marker);
opendiv();
}
})(marker, i));
}
}
И мой HTML
Stuff to display
Stuff to display