I'm having an issue with multiple markers on google maps - I currently have a MySQL database storing info (location info). In php I then extract this info and loop through each postcode to dynamically create the required javascript to place a marker for each place in my database.

This works successfully so I know that I'm passing the correct information to the js function - Now what I'm trying to achieve is adding additional information when the marker is clicked but its showing the same on every marker window.

This is the js I'm using (I initiate an icon at the top but excluded this from the code for now):

function usePointFromPostcode(postcode, callbackFunction, text) {

    localSearch.setSearchCompleteCallback(null, 
        function() {

            if (localSearch.results[0])
            {       
                var resultLat = localSearch.results[0].lat;
                var resultLng = localSearch.results[0].lng;
                var point = new GLatLng(resultLat,resultLng);
                callbackFunction(point, text);
            }else{
                alert("Postcode not found!");
            }
        }); 

    localSearch.execute(postcode + ", UK");
}

function placeMarkerAtPoint(point, html, icon)
{
    var marker = new GMarker(point,{icon: icon});

    GEvent.addListener(marker,"click",function() {
        marker.openInfoWindowHtml(html);
    });

    map.addOverlay(marker);
}

The php code I have is:

$query = "SELECT * FROM hospitalInfo";
$result = mysql_query($query);

if($result) {
    while ($row = mysql_fetch_assoc($result)) {
        $code .= "usePointFromPostcode('".$row['Postcode']."', placeMarkerAtPoint, 
        '".$row['placeName']."');";

    }
}

$code is then echo'ed.

Any advice on why this is occuring would be much appreciated! Thanks !

I'm having an issue with multiple markers on google maps - I currently have a MySQL database storing info (location info). In php I then extract this info and loop through each postcode to dynamically create the required javascript to place a marker for each place in my database.

This works successfully so I know that I'm passing the correct information to the js function - Now what I'm trying to achieve is adding additional information when the marker is clicked but its showing the same on every marker window.

This is the js I'm using (I initiate an icon at the top but excluded this from the code for now):

function usePointFromPostcode(postcode, callbackFunction, text) {

    localSearch.setSearchCompleteCallback(null, 
        function() {

            if (localSearch.results[0])
            {       
                var resultLat = localSearch.results[0].lat;
                var resultLng = localSearch.results[0].lng;
                var point = new GLatLng(resultLat,resultLng);
                callbackFunction(point, text);
            }else{
                alert("Postcode not found!");
            }
        }); 

    localSearch.execute(postcode + ", UK");
}

function placeMarkerAtPoint(point, html, icon)
{
    var marker = new GMarker(point,{icon: icon});

    GEvent.addListener(marker,"click",function() {
        marker.openInfoWindowHtml(html);
    });

    map.addOverlay(marker);
}

The php code I have is:

$query = "SELECT * FROM hospitalInfo";
$result = mysql_query($query);

if($result) {
    while ($row = mysql_fetch_assoc($result)) {
        $code .= "usePointFromPostcode('".$row['Postcode']."', placeMarkerAtPoint, 
        '".$row['placeName']."');";

    }
}

$code is then echo'ed.

Any advice on why this is occuring would be much appreciated! Thanks !

• javascript
• google-maps

• Any chance that you could post a link to the page? I agree with @Cannonade that there doesn't seem to be anything wrong with the Google Maps code. Are you sure that the PHP code is outputting the right stuff? – Chris B Commented Jul 1, 2009 at 16:04
• Unfortunately I can't post a link to the code since I'm hosting it on an internal server sorry. Thanks for trying to help me out. I did also think there was something wrong with the php output but I checked this by just outputting it to an alert box & it is providing different text everytime so thats why i thought there was something wrong with my javascript – samcooper11 Commented Jul 1, 2009 at 20:09
• This is the search I'm using: var localSearch = new GlocalSearch(); – samcooper11 Commented Jul 3, 2009 at 7:00
• Yes, but do you need local search? Are you using any of the actual local search results? Because if all you need is to get the coordinates for a post code, it might be simpler to use GClientGeocoder. code.google./apis/maps/documentation/services.html#Geocoding – Chris B Commented Jul 3, 2009 at 20:49

4 Answers 4

You may be having a scope/closure problem, similar to the issue discussed here.

Try replacing this code:

GEvent.addListener(marker,"click",function() {
    marker.openInfoWindowHtml(html);
});

with this:

marker.bindInfoWindowHtml(html);

If that doesn't work, I'd guess that the closure problem is ing from the setSearchCompleteCallback() function. It's difficult to guess without seeing the actual page.

As you mentioned in your ment, the problem is that you're sending several requests before you get any results, and the value of the marker text changes each time you send the request. I think you could greatly simplify your code by using the GClientGeocoder - unless it's absolutely necessary to use GLocalSearch, which isn't really part of the Maps API. Here's Google's tutorial for the geocoder.

First create the geocoder like this:

var geocoder = new GClientGeocoder();

Next, here's your new usePointFromPostcode() function:

function usePointFromPostcode(postcode, text) {
    geocoder.getLatLng(postcode, function(point) {
        if (!point) {
            //alert('address not found');
        } else {
            var marker = new GMarker(point, {icon: icon});
            GEvent.addListener(marker, "click", function() {
                marker.openInfoWindowHtml(text);
            });
            map.addOverlay(marker);
        }
    });
}

This worked great for me. Try it out and let us know how it goes.

If you need more information about the returned point, like accuracy, use getLocations() instead of getLatLng(). The tutorial explains how it works.

I don't see a problem with your Google Maps Code. I suggest you try logging the html parameters in placeMarkerAtPoint and the text param to the localSearch callback. Google have a very useful logging API you could use:

GLog Reference

I would add at the begining of the placeMarkerAtPoint function:

GLog.write ("placeMarkerAtPoint - " + html);

and in the localSearch callback:

GLog.write ("SearchCompleteCallback - " + text);

I think the logging for these two callbacks (particularly the second one), will make it obvious where the html is getting lost.

Update: Ok, based on your logging your PHP code is fine. You are generating three calls to usePointFromPostcode.

The problem here is with your google.search.SearchControl callback. I am assuming the search is working correctly and the results array you get back is appropriate for each respective postcode?

If so, then the problem is with the text parameter in the setSearchCompleteCallback. I haven't used the Google AJAX Search stuff, but the problem lies in how these callbacks are fired. It looks like you can get multiple callbacks for a single execute.

You're re-using the name marker so the last text you place ends up getting attached to all of them. Create an index and name them marker1, marker2, etc. Its easy to do in a php loop.