Question

I have a google-maps mashup that worked fairly well with “small” test files – every file I generated, even for a 60 mile trip, was less than 16k.

Then, yesterday, a user sent me a KML file they were having problems with – it’s over 360k in size and, while it uploads okay, and when I call GGeoXML(), it appears to load into Google Maps okay, but no map appears and the error “Script error. (main.js,0)” appears in the log. This happens both in my own application and if I try to feed the kml file to Google’s “Code Playground” – but the file loads fine in Google Earth. If I re-save the file from Google Earth into kmz format, that also works – but since the file is no longer XML, I lose some of the “added value” features of my mashup.

I’ve scanned the Google documentation, but I could not find any reference to a maximum file size for kml files.

Any suggestions?

Here’s a code fragment that causes the problem in the Code Playground:

var map;
function zoomToGeoXML(geoXml) {
    var center = geoXml.getDefaultCenter();
    var span = geoXml.getDefaultSpan();
    var sw = new GLatLng(center.lat() - span.lat() / 2,
                    center.lng() - span.lng() / 2);
    var ne = new GLatLng(center.lat() + span.lat() / 2,
                    center.lng() + span.lng() / 2);
    var bounds = new GLatLngBounds(sw, ne);
    map.setCenter(center);
    map.setZoom(map.getBoundsZoomLevel(bounds));
}

function initialize() {
  if (GBrowserIsCompatible()) {
    map = new GMap2(document.getElementById("map_canvas"));
    var geoXml = new GGeoXml("http://(my base url)/files/gps/expr.kml",
                function() { zoomToGeoXML(geoXml); });
    map.addOverlay(geoXml);
  }
}

Answer 1

If you rearrange a few lines from Mike’s example, you get rid of the “side-effect that the map will initially be of the entire globe before zooming into the area defined by the kml file.”

var map;

function loadMapAndZoomToGeoXML(geoXml) {
    center = geoXml.getDefaultCenter();
    var span = geoXml.getDefaultSpan();
    var sw = new GLatLng(center.lat() - span.lat() / 2, center.lng() - span.lng() / 2);
    var ne = new GLatLng(center.lat() + span.lat() / 2, center.lng() + span.lng() / 2);
    var bounds = new GLatLngBounds(sw, ne);
    map = new GMap2(document.getElementById("map_canvas"));
    map.setCenter(center);
    map.setZoom(KmlMap.getBoundsZoomLevel(bounds));
    map.addOverlay(geoXml);
    map.enableScrollWheelZoom();
    map.setUIToDefault();
    map.addControl(new GLargeMapControl());
}

function initialize() {
    if (GBrowserIsCompatible()) {
        var geoXml = new GGeoXml("http://(my base url)/files/gps/expr.kml", function() { loadMapAndZoomToGeoXML(geoXml); });
    }
}

Unfortunately it ties up the business of loading the map with zooming it and centering it, but that can be refactored further. I wanted to stick to the example Mike gave as much as possible.