Cluster same lat/lng gmaps v3

On my website I have a form that allows users to register. It asks users to provide their city, state, and country. I also have a map that drops a marker for each user based on a lat/lng that's drawn from that city, state, country combination ($location).

Because I'm not being supe开发者_如何学Cr specific (as in, I'm not asking for their ACTUAL address), I have a number of users that have the same lat/lng. And this creates a problem when trying to view markers on my map.

Should I use a clustering service? If so, do you have any suggestions?? Like I said, information flows from mySQL database --> XML --> PHP.

If so, it'll be clustered at the most zoomed level (like I said, same lat/lng). As a result, I'm going to need a info window that allows me to select each user at that particular location.

Ideas? Suggestions??? Much appreciated!!!

Jeremy

---

MarkerClusterer: http://gmaps-utility-library.googlecode.com/svn/trunk/markerclusterer/1.0/docs/examples.html

Or by hand (roughly - sample code only!)

        var latlng = new google.maps.LatLng(-33.8671390, 151.2071140);
        var myOptions = {
            zoom: 8,
            center: latlng,
            mapTypeId: google.maps.MapTypeId.ROADMAP
        };
        var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

        var markers = [];
        var newmarkers = [];

        for(var j=0; j<5; j++) {
            markers.push({lat:-33.8671390, lng:151.2071140, title:'This is marker #' + i });

            if(j==0) newmarkers.push(markers[j]);
            for(var i=0; i<newmarkers.length; i++) {
                if(newmarkers[i].lat == markers[j].lat && newmarkers[i].lng == markers[j].lng) {
                    newmarkers[i].title += ' AND ' + markers[j].title;
                    continue;
                }
                newmarkers.push(markers[j]);
            }
        }

        for(var i=0; i<newmarkers.length; i++) {
            var mkr = new google.maps.Marker({
                position: new google.maps.LatLng(newmarkers[i].lat, newmarkers[i].lng), 
                map: map, 
                title: newmarkers[i].title
            });
        }

---

Thought I'd paste my code:

function load() {
  if (GBrowserIsCompatible()) {
    var map = new GMap2(document.getElementById("map"));
    map.addControl(new GSmallMapControl());
    map.addControl(new GMapTypeControl());
    map.setCenter(new GLatLng(47.614495, -122.341861), 2);
    map.enableScrollWheelZoom();

GDownloadUrl("world_xml.php", function(data) {
  var xml = GXml.parse(data);
  var markers = xml.documentElement.getElementsByTagName("marker");
  for (var i = 0; i < markers.length; i++) {
    var first_name = markers[i].getAttribute("first_name");
    var last_name = markers[i].getAttribute("last_name");
    var email = markers[i].getAttribute("email");
    var affiliation = markers[i].getAttribute("affiliation");
    var status = markers[i].getAttribute("status");
    var service = markers[i].getAttribute("service");
    var rank = markers[i].getAttribute("rank");
    var specialty = markers[i].getAttribute("specialty");
    var city = markers[i].getAttribute("city");
    var state = markers[i].getAttribute("state");
    var country = markers[i].getAttribute("country");
    var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                            parseFloat(markers[i].getAttribute("lng")));
    var marker = createMarker(point, rank, first_name, last_name, email, affiliation, status, service, specialty, city, state, country);
    map.addOverlay(marker);
  }
});

} }

function createMarker(point, rank, first_name, last_name, email, affiliation, status, service, specialty, city, state, country) { var marker = new GMarker(point); var html = "" + rank + " " + first_name + " " + last_name + "
" + service + ", " + status + "
" + specialty + "
" + affiliation + "
" + city + ", " + state + " " + country + "
" + email + "
" + " "; GEvent.addListener(marker, 'click', function() { marker.openInfoWindowHtml(html); }); return marker; }