0

I have written a short script to take an array of location objects (generated by PHP) and plot them on a Google Map.

For the life of me, I cannot work out why the addMarker() loop breaks?

An example of an array I am sending to initializeMap():

[
    {
        date: '08/11/2011',
        venue: 'Notes',
        city: 'Newtown, NSW',
        ticket: 'http://noteslive.net.au/'
    }
]

And the code:

// Accepts an array of gigs  
function initializeMap(gigs) {

var markers = gigs;

// Create geocoder
var geocoder = new google.maps.Geocoder();

// Create the map
var map = new google.maps.Map(document.getElementById("gigpress-map"), {
    mapTypeId: google.maps.MapTypeId.ROADMAP
});

// Create infowindow object
var infowindow = new google.maps.InfoWindow({
    content: "holding..."
});

// Add markers to map
for (index in markers) addMarker(markers[index]);

function addMarker(data) {
    alert('bang');
    geocoder.geocode( { 'address': data.city}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var marker = new google.maps.Marker( {
                position: results[0].geometry.location,
                map: map,
                title: data.venue
            });
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });

    // Bind click event to each marker
    google.maps.event.addListener(marker, "click", function() {
        infowindow.open(map, this);
    });
}

// Zoom and center the map to fit the markers
var bounds = new google.maps.LatLngBounds();

for (index in markers) {
    var data = markers[index];
    geocoder.geocode( { 'address': data.city}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            bounds.extend(new google.maps.LatLng(results[0].geometry.location));
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    }); 
}

map.fitBounds(bounds);
}
4
  • 1
    where does it break? does it geocode successfully or there is not request going to the geocoder?
    – Baz1nga
    Sep 18, 2011 at 9:45
  • 1
    host the code on jsfiddle and try to reproduce the error there and update the question with the link
    – Baz1nga
    Sep 18, 2011 at 9:45
  • Yes it geocodes successfully. The loop does not complete. Bear with me, I am new to jsfiddle, I will host there now.
    – Adam Stone
    Sep 18, 2011 at 11:24
  • Here is a link to jsfiddle... jsfiddle.net/KaSjH
    – Adam Stone
    Sep 18, 2011 at 11:38

2 Answers 2

1

the problem was the way you were adding the listener on the marker. I think I have fixed and I hope you can see your marker.. Here is the update to the jsfiddle you posted:

http://jsfiddle.net/anilkamath87/KaSjH/1/

function addMarker(data) {
    alert('bang');
    geocoder.geocode( { 'address': data.city}, function(results, status) {
        if (status == google.maps.GeocoderStatus.OK) {
            var marker = new google.maps.Marker( {
                position: results[0].geometry.location,
                map: map,
                title: data.venue
            });
         google.maps.event.addListener(marker, "click", function() {  // Bind click event to each marker should be here. else marker reference not found.
            infowindow.open(map, this);
    });
        } else {
            alert("Geocode was not successful for the following reason: " + status);
        }
    });



}
8
  • It would be great if you could include the relevant changes in the answer. If an external site goes away or even is just offline temporarily, it will be very helpful to have the key bits here.
    – Trott
    Sep 18, 2011 at 14:50
  • anyways I think this was too specific of a question to be helpful to others.. thats why else i generally dnt..
    – Baz1nga
    Sep 18, 2011 at 16:54
  • Good point. Thanks for adding the code anyway, though! I do think it improves the answer. +1
    – Trott
    Sep 18, 2011 at 17:25
  • Thanks zzzz! You are a champion... Very careless coding on my behalf. Markers are now plotting although the fitBounds function is not working? In the loop I add each co-ord to the bound object. Here is a revised link... jsfiddle.net/KaSjH/2
    – Adam Stone
    Sep 18, 2011 at 22:14
  • Trott, once I have finally resolved the issues, I will post a summary for any future users. Cheers.
    – Adam Stone
    Sep 18, 2011 at 23:05
0

For the complete working script head over to JSFiddle... This code will help you plot an array of markers and adjust the viewing boundary of the map.

http://jsfiddle.net/KaSjH/6/

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.