Google maps 使用Geoxml3在Google地图上加载KML文件
我的HTML如下所示Google maps 使用Geoxml3在Google地图上加载KML文件,google-maps,geoxml3,Google Maps,Geoxml3,我的HTML如下所示 <!DOCTYPE html> <html> <head> <meta name="viewport" content="initial-scale=1.0, user-scalable=no"/> <meta http-equiv="content-type" content="text/html; charset=UTF-8"/> <title>Google Maps JavaScript API
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no"/>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<title>Google Maps JavaScript API v3 Example: Directions Complex</title>
<style>
html{height:100%;}
body{height:100%;margin:0px;font-family: Helvetica,Arial;}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="http://geoxml3.googlecode.com/svn/branches/polys/geoxml3.js"></script>
<script type="text/javascript" src="http://geoxml3.googlecode.com/svn/trunk/ProjectedOverlay.js"></script>
<script type="text/javascript">
jQuery(document).ready(function () {
var myOptions = {
center: new google.maps.LatLng(39.397, -100.644),
zoom: 4,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
var geoXml = new geoXML3.parser({
map: map,
singleInfoWindow: true,
afterParse: useTheData
});
geoXml.parse('google_earth_tutorial_files.kml');
}
);
function useTheData(doc) {
// Geodata handling goes here, using JSON properties of the doc object
for (var i = 0; i < doc[0].markers.length; i++) {
// console.log(doc[0].markers[i].title);
jQuery('#map_text').append(doc[0].markers[i].title + ', ');
}
};
</script>
</head>
<body >
<form id="form1">
<div id="map_canvas" style="width:600px;height:500px;"></div>
<div id="map_text"></div>
</form>
</body>
</html>
html中的第35行是geoXml.parse('google_earth_tutorial_files.kml')
我不知道为什么会这样。请帮忙。
我可以看到地图,但没有加载KML层
我的KML是
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.0">
<Placemark>
<name>Manfred Mustermann</name>
<description>Manfred Mustermann</description>
<Point>
<coordinates>7.0964850607874,51.781641735074,0</coordinates>
</Point>
<address>Musterstr 29 Aachen, 52070 Nordrhein-Westfalen</address>
<styleUrl>#0</styleUrl>
</Placemark>
</kml>
曼弗雷德·穆斯特曼
曼弗雷德·穆斯特曼
7.0964850607874,51.781641735074,0
Musterstr 29亚琛,52070北莱茵威斯特法伦
#0
- 可能有帮助(如果您使用的是Chrome)
- 也许会有帮助
如果您可以运行本地web服务器,那么如果您的应用程序是公共的,对geoxml3来说并不重要,但是您需要阅读“useTheData”函数中的看起来像是一个问题(这是一个jquery错误,这是我看到的唯一被使用的地方)。KML看起来像什么?有没有公开的版本?我已经在问题中发布了KML。我还删除了您要求我删除的代码。我现在得到未捕获的TypeError:无法读取markers.lengthMy kml中未定义的useTheData的属性“length”。它坐在我的眼睛上,我看得见。显然我做错了什么。问题-我是从机器上的文件夹运行HTML和KML文件,还是必须是Web服务器?如果它必须是一个web服务器,那么如果我的web应用程序不是公共的,它会有区别吗?文件和html都在localhost/directory中,我使用parseKmlString进行了工作,因为它找不到我的文件-谢谢
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.0">
<Placemark>
<name>Manfred Mustermann</name>
<description>Manfred Mustermann</description>
<Point>
<coordinates>7.0964850607874,51.781641735074,0</coordinates>
</Point>
<address>Musterstr 29 Aachen, 52070 Nordrhein-Westfalen</address>
<styleUrl>#0</styleUrl>
</Placemark>
</kml>