Why does my valid kml show as "INVALID_DOCUMENT" when loaded to google maps

Question

I have a layer I'm trying to push to google maps.

The page is here: http://live2.offrs.com/buyerherodev/ziptractselect.html?ZIP=20001

the data source for the kml is here: http://live2.offrs.com/buyerherodev/data/polytract.cfm?ZIP=20001&dummy=1442778330778

When I enter url for the kml in the Glados, it says that there are no errors.

However, when I load it in my page, it shows "INVALID_DOCUMENT".

I did build the kml url dynamically, but once the url is constructed, I send it to console.log to confirm it. No issues.

Can anyone tell me where to look? Thanks

Here's the javascript for the maps:

var map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);

var boundaryurl = window.location.protocol + "//" + window.location.host + "/buyerherodev/data/polygon.cfm?TYPE=ZIP&VALUE=" + getUrlVars()["ZIP"] + "&LC=641400FF&LW=3&FC=14F11C2E&F=1&FO=1";
var tracturl = window.location.protocol + "//" + window.location.host + "/buyerherodev/data/polytract.cfm?ZIP=" + getUrlVars()["ZIP"]+"&dummy="+(new Date()).getTime();

console.log(boundaryurl);
console.log(tracturl);

var kmlLayer1 = new google.maps.KmlLayer(boundaryurl, {
    suppressInfoWindows: true,
    preserveViewport: false,
    map: map,
    zindex: 0,
    clickable : false
});


var kmlLayer2 = new google.maps.KmlLayer(tracturl, {
    suppressInfoWindows: true,
    preserveViewport: false
});

console.log(kmlLayer2);


google.maps.event.addListener(kmlLayer2,'status_changed', function() {
  if (!(kmlLayer2.getStatus() == 'OK')) {
    alert("There are no tracts.  Try again.");
    // window.location="http://domain.com/findterritory_none.cfm";
  }
});

kmllayer1 works with no issues. kmllayer2 is the layer I'm speaking about today. It's kmllayer2 that is the problem. I put the 'status_changed' listener to check for a bad kml, and here where is the error is reported.

Am I missing something?

Thanks

Dr.Molle Dr.Molle · Accepted Answer · 2015-09-20T21:22:14

The Content-Type of the KML-file must be application/vnd.google-earth.kml+xml , but currently it's application/xml

You must configure the server to return the correct Content-Type-header :

Example using the same file with correct header(using phpfiddle, I'm not sure how long it will work):

function init() {
  var mapOptions = {
    zoom: 0,
    center: {
      lat: 0,
      lng: 0
    }
  };
  map = new google.maps.Map(document.getElementById('map_canvas'),
    mapOptions);

  new google.maps.KmlLayer('http://main.xfiddle.com/code_63194890.php', {
    map: map
  });


}

html,
body,
#map_canvas {
  height: 100%;
  margin: 0;
  padding: 0;
}

<div id="map_canvas"></div>
<script src="https://maps.googleapis.com/maps/api/js?v=3&callback=init"></script>

Why does my valid kml show as "INVALID_DOCUMENT" when loaded to google maps

2 Answers