为什么我的有效 kml 在上传到谷歌地图时显示为“无效文档”答案

【问题标题】：Why does my valid kml show as "INVALID_DOCUMENT" when loaded to google maps为什么我的有效 kml 在上传到谷歌地图时显示为“无效文档”
【发布时间】：2015-12-17 11:14:55
【问题描述】：

我有一个图层正在尝试推送到谷歌地图。

页面在这里：http://live2.offrs.com/buyerherodev/ziptractselect.html?ZIP=20001

kml 的数据源在这里：http://live2.offrs.com/buyerherodev/data/polytract.cfm?ZIP=20001&dummy=1442778330778

当我在 Glados 中输入 kml 的 url 时，它说没有错误。

但是，当我在我的页面中加载它时，它会显示“INVALID_DOCUMENT”。

我确实动态构建了 kml url，但是一旦构建了 url，我将它发送到 console.log 以确认它。没有问题。

谁能告诉我去哪里看？谢谢

这是地图的 javascript：

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 可以正常工作。 kmllayer2 是我今天要谈论的层。问题出在 kmllayer2 上。我放了 'status_changed' 监听器来检查是否有错误的 kml，这里哪里报错了。

我错过了什么吗？

谢谢

【问题讨论】：

标签： javascript google-maps

【解决方案1】：

KML 文件的 Content-Type 必须是 application/vnd.google-earth.kml+xml ，但目前是 application/xml

您必须配置服务器以返回正确的 Content-Type-header ：

使用具有正确标题的相同文件的示例（使用 phpfiddle，我不确定它会工作多长时间）：

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>

【讨论】：

非常感谢。这被完美地解释了。我要秃头了。再次感谢。

【解决方案2】：

我的朋友，google maps javascript API，KML 层，将 KML 大小限制为 10MB。超过 10MB，您将在 kmllayer 对象上获得无效的文档状态。

您的 KML 必须先加载到 google KML 服务，然后再将平铺图像返回给您。因此，您的 KML 大小必须小于 10MB。

https://developers.google.com/maps/documentation/javascript/kmllayer#restrictions

【讨论】：