Google Maps Max Markers

Question

I'm not too great with javascript. Does anyone know how I can increase the number of markers displayed on Google Maps. I'm pulling about 300 locations from a MySQL database, but it's only plotting 50 or so.

Here's the code I'm using:

    <script type="text/javascript">
//<![CDATA[

var iconBlue = new GIcon(); 
iconBlue.image = 'http://labs.google.com/ridefinder/images/mm_20_blue.png';
iconBlue.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
iconBlue.iconSize = new GSize(12, 20);
iconBlue.shadowSize = new GSize(22, 20);
iconBlue.iconAnchor = new GPoint(6, 20);
iconBlue.infoWindowAnchor = new GPoint(5, 1);

var iconRed = new GIcon(); 
iconRed.image = 'http://labs.google.com/ridefinder/images/mm_20_red.png';
iconRed.shadow = 'http://labs.google.com/ridefinder/images/mm_20_shadow.png';
iconRed.iconSize = new GSize(12, 20);
iconRed.shadowSize = new GSize(22, 20);
iconRed.iconAnchor = new GPoint(6, 20);
iconRed.infoWindowAnchor = new GPoint(5, 1);

var customIcons = [];
customIcons["city"] = iconBlue;

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), 1);
 map.setMapType(G_SATELLITE_MAP);

    GDownloadUrl("map-xml.php", function(data) {
      var xml = GXml.parse(data);
      var markers = xml.documentElement.getElementsByTagName("geolocation");
      for (var i = 0; i < markers.length; i++) {
        var time = markers[i].getAttribute("time");
        var date = markers[i].getAttribute("date");
  var city = markers[i].getAttribute("city");
        var type = markers[i].getAttribute("city");
        var point = new GLatLng(parseFloat(markers[i].getAttribute("lat")),
                                parseFloat(markers[i].getAttribute("lng")));
        var marker = createMarker(point, time, date, city, type);
        map.addOverlay(marker);
      }
    });
  }
}

function createMarker(point, time, date, city, type) {
  var marker = new GMarker(point, customIcons[type]);
  var html = "<b>Time:" + time + "<br />Date:" + date + "<br/>City:" + city +"</b>";
  GEvent.addListener(marker, 'click', function() {
    marker.openInfoWindowHtml(html);
  });
  return marker;
}
//]]>

Thanks

Answer 1

I don't know of any limit on the markers allowed, I worked on a page with nearly 300 (http://bic-church.org/about/churches/map.asp). Mine, however, are loaded from a JSON file. Is it possible that you are experiencing some sort of timeout issue?

Edit: Additional thought: If you notice it consistently failing at a certain point, check the integrity of the data for that marker. You might find it is a bad lat/long or something.

Answer 2

I think you are looking for a Marker Manager.

Answer 3

I suspect that your markers are being plotted, but you're not seeing them for some reason.

Check that you're not plotting lots of markers at exactly the same location. If you plot one marker exactly on top of another it looks like one marker rather than of two.

Check that all your customIcons have image files in the right place. If there's no icon image you might not see anything.

customIcons[type] can fail if your "type" variable doesn't match one of your values. In particular the values are case specific. But if that's your problem you'd expect a Javascript error. Have you checked your error console?

Check that all your customIcons have a sensible size. If you omit the size parameter, the API will plot the image with zero size in some browsers.