Creating new markers from an array in Javascript google maps API

Question

I am trying to add markers onto a google map to identify the states using:

function initialize() {
 var map = new GMap2(document.getElementById("map_canvas"));
 map.setCenter(new GLatLng(-25.641526,134.472656), 4);
 map.setMapType(G_NORMAL_MAP);
 map.setUIToDefault();

var states =["-35.083236,138.503909","-24.607069,144.667969","-18.229351,133.417969","-24.686952,123.574219","-32.398516,146.953125","-35.46067,149.150391","-37.020098,143.701172","-42.682435,146.733398"]; 
  for (i = 0; i == states.length; i++) {
  var point = new GLatLng(parseFloat(states[i]));
  map.addOverlay(new GMarker(point));
  }
}

But no markers come up when I load the map (which loads fine, properly centered and of the correct map type). What am I doing wrong here?

EDIT: I changed it to this and now it works:

var lats =[-35.083236,-24.607069,-18.229351,-24.686952,-32.398516,-35.46067,-37.020098,-42.682435];
var longs =[138.503909,144.667969,133.417969,123.574219,146.953125,149.150391,143.701172,146.733398];

for (i = 0; i <= lats.length; i++) {
var point = new GLatLng(lats[i],longs[i]);
map.addOverlay(new GMarker(point));

Community · Accepted Answer · 2017-05-23 12:03:30Z

5

It looks like a typo in your for loop. Try it as follows:

for (i = 0; i < states.length; i++) {

Also note the float problem that Tomas pointed out.

edited May 23, 2017 at 12:03

CommunityBot

11 silver badge

answered Jan 18, 2010 at 12:27

Daniel Vassallo

346k72 gold badges513 silver badges447 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Jonno_FTW Over a year ago

Thanks, I am new to using for loops.

Daniel Vassallo Over a year ago

@Jonno: Also note the float problem that Tomas pointed out. It wasn't just the for loop.

Anurag Over a year ago

i is referring to some global variable right now. if that's not on purpose, its better to declare it in the loop itself - for(var i = 0;

Tomas · Accepted Answer · 2010-01-18 12:30:20Z

3

You are parsing a single float value and try to use that as both latitude and longitude.

This ...

var point = new GLatLng(parseFloat("-35.083236,138.503909"));

won't parse two distinct float values and pass them to the GLatLng. One solution is to split the values in the array:

function initialize() {
 var map = new GMap2(document.getElementById("map_canvas"));
 map.setCenter(new GLatLng(-25.641526,134.472656), 4);
 map.setMapType(G_NORMAL_MAP);
 map.setUIToDefault();

 var states =[-35.083236, 138.503909, -24.607069, 144.667969, ...
 for (i = 0; i < states.length; i+=2) {
   var point = new GLatLng(states[i], states[i+1]);
   map.addOverlay(new GMarker(point));
}

}

Also note that your for loop was incorrect as Daniel pointed out.

answered Jan 18, 2010 at 12:30

Tomas

5,1851 gold badge38 silver badges40 bronze badges

1 Comment

Tomas Over a year ago

Actually I missed the loop bug :)

Collectives™ on Stack Overflow

Creating new markers from an array in Javascript google maps API

2 Answers 2

3 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

3 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related