Google Maps JS API v2 - Simple Multiple Marker Example

Question

I'm fairly new to gmaps and Im using v2 because of the search function that I didnt find in v3.

I've got an array of data that I want to loop through and put the markers on the map =)

It seems really easy but I cant get it to work with v2 at all...

Here is my what my array format and code looks like:

function createMarkers(myLatLng,html) {
  var marker = new GMarker(myLatLng, markerOptions);
  GEvent.addListener(marker, 'click', function() {
    marker.openInfoWindowHtml(html);
  });
  return marker;
}


var locations = [
  ["Bondi Beach",-33.890542,151.274856],
  ["Coogee Beach",-33.923036,151.259052],
  ["Cronulla Beach",-34.028249,151.157507],
  ["Manly Beach",-33.80010128657071,151.28747820854187],
  ["Maroubra Beach",-33.950198,151.259302]
];


for (var i = 0; i < location.length; i++) {
   var locations = locations[i];
   var myLatLng = new GLatLng(locations[1],locations[2]);
   var dynamicmarker = createMarkers(myLatLng);
   map.addOverlay(dynamicmarker);
}

The beachnames got position locations[0], the lat got position location[1] and lng got position location[2] and so on...

I didnt use the names of the beaches as the "html"option, but I only get one marker on the screen. Ive checked the for loop and it looks correct, v3 is so simple to get it to work. But I need to have the search function that v2 has...

Would be so grateful if someone could give me a tip or show me how to go thru the array and get those markers to show up!

Answer 1

You appear to have a few problems in the for loop. First of all location.length should be locations.length. Then you seem to be re-declaring a locations variable within the for loop. Remember that JavaScript does not have block scope.

You may want to try the following:

var i, myLatLng;

for (i = 0; i < locations.length; i++) {
   myLatLng = new GLatLng(locations[i][1], locations[i][2]);
   map.addOverlay(createMarkers(myLatLng));
}