标记不会显示在Google地图KML文件中 [英] Markers Not Showing in a Google Maps KML file
问题描述
我在Google MyMaps网络应用程序中生成了一张地图。现在我想将它包含到我的页面中（但不能作为嵌入式地图！）。
我已经下载了一个kml文件并将其添加到html页面。除标记没有显示外，一切都很好。有人知道问题是什么吗？
以下是我的3个文件：
HTML：
<！DOCTYPE html>
< html>
< head>
< meta charset =utf-8>
< title>地图< /标题>
< script src =http://maps.googleapis.com/maps/api/js?key=MY-KEY>< / script>
< script src =script.js>< / script>
< / head>
< body onload =initialize（）>
< h1>地图< / h1>
< div id =mapstyle =width：750px; height：520px;>< / div>
< div id =capture>< / div>
< / body>
< / html>
Script.js：
var map;
var src ='http://my-website.com/map.kml';
函数initialize（）{
map = new google.maps.Map（document.getElementById（'map'），{
mapTypeId：google.maps.MapTypeId.TERRAIN
} ）;
loadKmlLayer（src，map）;
}
函数loadKmlLayer（src，map）{
var kmlLayer = new google.maps.KmlLayer（src，{
suppressInfoWindows：true，
preserveViewport：false，
map：map
}）;
google.maps.event.addListener（kmlLayer，'click'，function（event）{
var content = event.featureData.infoWindowHtml;
var testimonial = document.getElementById（'capture' ）;
testimonial.innerHTML = content;
}）;
}
google.maps.event.addDomListener（window，'load'，initialize）;
KML： code><？xml version ='1.0'encoding ='UTF-8'？>
< kml xmlns ='http：//www.opengis.net/kml/2.2'>
<文件>
<名称>我的地图< / name>
< description><！[CDATA []]>< / description>
< NetworkLink>
<名称>位置< /名称>
< Link>
< href> http：//mapsengine.google.com/map/kml？mid = zVGRYK81syB4.kFYbbKCtNMQw< / href>
< / Link>
< / NetworkLink>
< / Document>
< / kml>
请参阅 KML文档
< StyleMap> 。
$ b 您的kmz使用
< StyleMap> 来定义图标： < Style id ='icon-960-F8971B-normal'>
< IconStyle>
< color> ff1B97F8< / color>
< scale> 1.1< / scale>
<图标>
< href> http：//www.gstatic.com/mapspro/images/stock/960-wht-star-blank.png< / href>
< /图标>
< / IconStyle>
< LabelStyle>
< scale> 0.0< / scale>
< / LabelStyle>
< / style>
< Style id ='icon-960-F8971B-highlight'>
< IconStyle>
< color> ff1B97F8< / color>
< scale> 1.1< / scale>
<图标>
< href> http：//www.gstatic.com/mapspro/images/stock/960-wht-star-blank.png< / href>
< /图标>
< / IconStyle>
< LabelStyle>
< scale> 1.1< / scale>
< / LabelStyle>
< / style>
< StyleMap id ='icon-960-F8971B'>
< Pair>
< key>正常< / key>
< styleUrl>＃图标-960-F8971B-normal< / styleUrl>
< / Pair>
< Pair>
< key>突出显示< / key>
< styleUrl>＃图标-960-F8971B-highlight< / styleUrl>
< / Pair>
< / StyleMap>
您需要删除这些内容，如果您希望它与KmlLayer一起使用，请使用标准图标当前最少）：
< Style id ='icon-960-F8971B'>
< IconStyle>
< color> ff1B97F8< / color>
< scale> 1.1< / scale>
<图标>
< href> http：//www.gstatic.com/mapspro/images/stock/960-wht-star-blank.png< / href>
< /图标>
< / IconStyle>
< LabelStyle>
< scale> 0.0< / scale>
< / LabelStyle>
< / style>
I have generated a map in the Google MyMaps web-application. Now I want to include it to my page (but not as an embedded map!).
I have downloaded a kml file and added it to a html page. Everything is okay except markers are not showing. Does anybody know what the problem is?
Here are my 3 files:
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Map</title>
<script src="http://maps.googleapis.com/maps/api/js?key=MY-KEY"></script>
<script src="script.js"></script>
</head>
<body onload="initialize()">
<h1>Map</h1>
<div id="map" style="width:750px;height:520px;"></div>
<div id="capture"></div>
</body>
</html>
Script.js:
var map;
var src = 'http://my-website.com/map.kml';
function initialize() {
map = new google.maps.Map(document.getElementById('map'), {
mapTypeId: google.maps.MapTypeId.TERRAIN
});
loadKmlLayer(src, map);
}
function loadKmlLayer(src, map) {
var kmlLayer = new google.maps.KmlLayer(src, {
suppressInfoWindows: true,
preserveViewport: false,
map: map
});
google.maps.event.addListener(kmlLayer, 'click', function(event) {
var content = event.featureData.infoWindowHtml;
var testimonial = document.getElementById('capture');
testimonial.innerHTML = content;
});
}
google.maps.event.addDomListener(window, 'load', initialize);
KML:
<?xml version='1.0' encoding='UTF-8'?>
<kml xmlns='http://www.opengis.net/kml/2.2'>
<Document>
<name>My Map</name>
<description><![CDATA[]]></description>
<NetworkLink>
<name>locations</name>
<Link>
<href>http://mapsengine.google.com/map/kml?mid=zVGRYK81syB4.kFYbbKCtNMQw</href>
</Link>
</NetworkLink>
</Document>
</kml>
See the KML documentation
<StyleMap> is not supported by KmlLayer.
Your kmz is using <StyleMap> to define the icons:
<Style id='icon-960-F8971B-normal'>
<IconStyle>
<color>ff1B97F8</color>
<scale>1.1</scale>
<Icon>
<href>http://www.gstatic.com/mapspro/images/stock/960-wht-star-blank.png</href>
</Icon>
</IconStyle>
<LabelStyle>
<scale>0.0</scale>
</LabelStyle>
</Style>
<Style id='icon-960-F8971B-highlight'>
<IconStyle>
<color>ff1B97F8</color>
<scale>1.1</scale>
<Icon>
<href>http://www.gstatic.com/mapspro/images/stock/960-wht-star-blank.png</href>
</Icon>
</IconStyle>
<LabelStyle>
<scale>1.1</scale>
</LabelStyle>
</Style>
<StyleMap id='icon-960-F8971B'>
<Pair>
<key>normal</key>
<styleUrl>#icon-960-F8971B-normal</styleUrl>
</Pair>
<Pair>
<key>highlight</key>
<styleUrl>#icon-960-F8971B-highlight</styleUrl>
</Pair>
</StyleMap>
You need to remove those, use "standard icons" if you want it to work with KmlLayer (at least currently):
<Style id='icon-960-F8971B'>
<IconStyle>
<color>ff1B97F8</color>
<scale>1.1</scale>
<Icon>
<href>http://www.gstatic.com/mapspro/images/stock/960-wht-star-blank.png</href>
</Icon>
</IconStyle>
<LabelStyle>
<scale>0.0</scale>
</LabelStyle>
</Style>
example with (partially) modified KMZ
这篇关于标记不会显示在Google地图KML文件中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
