Using JSON file to plot multiple points on Google Maps.

[Stephan Wlodarczyk]

I have run into a dilemma here and am hoping someone may be able to
assist me with this issue. My JSON file is as follows:

{"markers": [
{
"abbreviation": "SPA",
"latitude":-13.32,
"longitude":-89.99,
"markerImage": "flags/us.png",
"information": "South Pole",
},

........... lots more in between here.

{
"abbreviation": "ALE",
"latitude":-62.5,
"longitude":82.5,
"markerImage": "flags/us.png",
"information": "Alert",
},
] }

My web page has Google maps already incorporated in it and yes, it is
fully functional. Now I am very new to Google Maps' API let alone very
new to the Javascript world. How can I code these the locations stored
in my JSON file and plot them on the map that is embedded on my web
page? Can I strictly use Javascript or do I need additional assistance
such as jQuery? I have been doing a few hours of research on this
issue but the subject matter, as of now, if very foreign to me.

Again, I'm a newcomer, learning on my own, so please try to respond
with specifics as I am not up to speed with all the Javascript jargon.
Thank you in advance.

[Chris Broadfoot]

You can definitely do it just in JavaScript... here's a starting point (untested..)

function addMarker(map, data) {

  var marker = new google.maps.Marker({

    position: new google.maps.LatLng(+data.latitude, +data.longitude),

    icon: data.markerImage

  });

  google.maps.event.addListener(marker, 'click', function() {

    infowindow.setContent(data.information);

    infowindow.open(map, marker);

  });

}

var infowindow = new google.maps.InfoWindow;

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

  addMarker(map, markers[i]);

}

--
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 google-map...@googlegroups.com.
To unsubscribe from this group, send email to google-maps-js-a...@googlegroups.com.
For more options, visit this group at http://groups.google.com/group/google-maps-js-api-v3?hl=en.

--
http://twitter.com/broady

[Esa]

Two minor things in the code:

1] I don't find marker overlayed on map

marker.setMap(map);
or
{map: map} in options

2] Missing brackets in:

var infowindow = new google.maps.InfoWindow();

[Chris Broadfoot]

On Fri, Jan 28, 2011 at 10:24 PM, Esa <esa.i...@gmail.com> wrote:

Two minor things in the code:

Oops. As I said, not tested.

 

2] Missing brackets in:

   var infowindow = new google.maps.InfoWindow();

When using the 'new' operator in JavaScript, you can omit the parentheses if you are not passing any arguments to the constructor.

Chris