将 KML 层添加到 Google Maps Embed API，而不是 Javascript

Question

我已将 Google 地图 API 嵌入到我的 Google 站点中，但我无法将我的 KML 图层嵌入其中。我想知道是否有人可以帮助我编写代码。

以下是适用于嵌入式小工具的代码：

<iframe
  width="1200"
  height="900"
  frameborder="0" style="border:0"
  src="https://www.google.com/maps/embed/v1/view?key=AIzaSyC3UDHvPat9pP5JH19ICl4agjWaNnTiNkI
&center=33.701923, -86.851167
  &zoom=7
  &maptype=roadmap">
</iframe>

这是我尝试嵌入的 KML 层的代码：

var layer = new google.maps.KmlLayer({
  driveFileId: "0B4CQLXiFWdl2OVV6STI5b1BLSUE"
});

我已经尝试了所有方法，但我不断收到代码错误。非常感谢任何帮助！

***回复回答：

在发布我的问题之前，我确实查看了该页面，但我不确定如何在我的 Google 网站上的 Google 小工具中使用该 HTML 代码。我试过了，但它不起作用。我上面放的初始代码变成了这样：

<img src="https://www.google.com/chart?chc=sites&amp;cht=d&amp;chdp=sites&amp;chl=%5B%5BGoogle+Gadget'%3D20'f%5Cv'a%5C%3D0'10'%3D1199'0'dim'%5Cbox1'b%5CF6F6F6'fC%5CF6F6F6'eC%5C0'sk'%5C%5B%22Include+gadget+(iframe)%22'%5D'a%5CV%5C%3D12'f%5C%5DV%5Cta%5C%3D10'%3D0'%3D1200'%3D897'dim'%5C%3D10'%3D10'%3D1200'%3D897'vdim'%5Cbox1'b%5Cva%5CF6F6F6'fC%5CC8C8C8'eC%5C'a%5C%5Do%5CLauto'f%5C&amp;sig=iWHUUzTOFEKRgAUogMaGWUuybBY" data-igsrc="http://0.gmodules.com/ig/ifr?mid=0&amp;synd=trogedit&amp;url=http%3A%2F%2Fwww.gstatic.com%2Fsites-gadgets%2Fiframe%2Fiframe.xml&amp;up_iframeURL=https%3A%2F%2Fwww.google.com%2Fmaps%2Fembed%2Fv1%2Fview%3Fkey%3DAIzaSyC3UDHvPat9pP5JH19ICl4agjWaNnTiNkI%0A%26center%3D33.701923%2C+-86.851167%0A++%26zoom%3D7%0A++%26maptype%3Droadmap&amp;w=1200&amp;h=900" data-type="ggs-gadget" data-props="height:900;igsrc:http#58//0.gmodules.com/ig/ifr?mid=0&amp;synd=trogedit&amp;url=http%3A%2F%2Fwww.gstatic.com%2Fsites-gadgets%2Fiframe%2Fiframe.xml&amp;up_iframeURL=https%3A%2F%2Fwww.google.com%2Fmaps%2Fembed%2Fv1%2Fview%3Fkey%3DAIzaSyC3UDHvPat9pP5JH19ICl4agjWaNnTiNkI%0A%26center%3D33.701923%2C+-86.851167%0A++%26zoom%3D7%0A++%26maptype%3Droadmap&amp;w=1200&amp;h=900;mid:0;spec:http#58//www.gstatic.com/sites-gadgets/iframe/iframe.xml;up_iframeURL:https#58//www.google.com/maps/embed/v1/view?key=AIzaSyC3UDHvPat9pP5JH19ICl4agjWaNnTiNkI &amp;center=33.701923, -86.851167   &amp;zoom=7   &amp;maptype=roadmap;width:1200;" width="1200" height="900" style="display:block;text-align:left;margin-right:auto;" class="igm">

所以没有办法将 KML 层放入其中？

Answer 1

根据您在问题中发布的内容，您将地图嵌入到 iframe 中，但尝试通过脚本将 KML 图层添加到其中。这两种方法将不兼容，因为您的页面上没有对地图对象的引用（它在 iframe 中）。

我建议您查看谷歌地图网站上的 kml 示例，该示例将引导您完成实例化地图对象、添加 KML 图层以及将 KML 图层分配给地图对象的过程。像这样：

function initialize() {
  var chicago = new google.maps.LatLng(41.875696,-87.624207);
  var mapOptions = {
    zoom: 11,
    center: chicago
  }

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

  var ctaLayer = new google.maps.KmlLayer({
    url: 'http://gmaps-samples.googlecode.com/svn/trunk/ggeoxml/cta.kml'
  });
  ctaLayer.setMap(map);
}

google.maps.event.addDomListener(window, 'load', initialize);

https://developers.google.com/maps/documentation/javascript/examples/layer-kml