I'm trying to assign a "click" event listener to multiple markers, so
that when I click on any of these markers the map is centered and
zoomed around the selected marker. The following code seems alright,
but leads to incorrect results. When I click on any marker the map
zooms into the last one that was added (Marker 3).
Does anyone know how I can solve this? Any help will be appreciated.
Thanks,
Ralph
--- Code Starts Here ---
function initialize() {
var map = new google.maps.Map(document.getElementById("map_canvas"),
{
zoom: 1,
center: new google.maps.LatLng(0, 0),
mapTypeId: google.maps.MapTypeId.ROADMAP
});
var myPositions = new Array(
new google.maps.LatLng(34.063334, -118.44695), // Marker 1
new google.maps.LatLng(34.102592, -118.340253), // Marker 2
new google.maps.LatLng(34.058603, -118.419048) // Marker 3
);
var marker = new Array();
// Create a LatLngBounds object
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < myPositions.length; i++) {
var current_position = myPositions[i];
marker[i] = new google.maps.Marker({
position: myPositions[i],
map: map,
title: "Marker " + i
});
google.maps.event.addListener(marker[i], 'click', function() {
map.setCenter(current_position);
map.setZoom(15);
});
bounds.extend(myPositions[i]);
}
map.fitBounds(bounds);
}
--
You received this message because you are subscribed to the Google Groups
"Google Maps JavaScript API v3" group.
To post to this group, send email to [email protected].
To unsubscribe from this group, send email to
[email protected].
For more options, visit this group at
http://groups.google.com/group/google-maps-js-api-v3?hl=en.
