Geoxml3问题(kmz库)
Geoxml3问题(kmz库)
提问于 2015-06-11 09:40:44
我想从KML中解析一个简单的标记，所以我已经用geoxml3做了一些测试，如果我使用(导入) 'polys/geoxml3.js‘库，一切都会很好，但如果我把它改为'kmz/geoxml3.js’(因为后来我想使用一些extendedData)，我会得到这个错误'Cannot read property 'setAnimation‘of undefined’。除了使用'kmz/geoxml3.js‘库，我还能怎么解决它呢？
<!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>Geoxml3</title>
<style>
html{height:100%;}
body{height:100%;margin:0px;}
#map_canvas{height: 90%;width: 90%;}
</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="http://geoxml3.googlecode.com/svn/branches/kmz/geoxml3.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?sensor=false"></script>
</head>
<body>
<div id="map_canvas"></div>
</div>
<script type="text/javascript">
var geoXml=null, map=null;
var infowindow = new google.maps.InfoWindow({});
function initialize() {
var myOptions = {
center: new google.maps.LatLng(39.397, -100.644),
zoom: 4,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
geoXml = new geoXML3.parser({
map: map,
zoom: true,
createMarker: addMyMarker,
singleInfoWindow: true,
suppressInfoWindows: true
});
geoXml.parse('exampleMarker.kml');
function addMyMarker(placemark,doc) {
var marker = geoXml.createMarker(placemark);
marker.setAnimation(google.maps.Animation.BOUNCE);
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(placemark.description);
infowindow.open(map,marker);
});
doc.markers.push(marker);
return marker;
};
};
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</body>
</html>我的KML文件是：
<?xml version="1.0" encoding="UTF-8"?>
<kml xmlns="http://earth.google.com/kml/2.1">
<Document>
<name>Chicago Bike Parking</name>
<description>A map of 20 bike parking.</description>
<Style id='bikeParkingIcon'>
<IconStyle>
<color>ffffffff</color>
<colorMode>normal</colorMode>
<scale>1.0</scale>
<Icon id='bikeParking'>
<href>icono.png
</href>
</Icon>
</IconStyle>
</Style>
<Placemark>
<name>2024 S Western</name>
<address>2024 S Western Ave, Chicago, IL 60608</address>
<phoneNumber></phoneNumber>
<description>1 bike rack installed here. <a href='http://www.chicagobikes.org/bikeparking/rackinfo.php?id=2' title='More info about this Bike Rack location'>More info</a>.</description>
<visibility>1</visibility>
<styleUrl>#bikeParkingIcon</styleUrl>
<Point>
<coordinates>-87.685871,41.854533,1000</coordinates>
</Point>
<TimeStamp><when>2009-07-24</when>
</TimeStamp>
<ExtendedData xmlns:cdot="http://www.chicagobikes.org/data">
<cdot:locName>Salvation Army</cdot:locName>
<exampleTag>My data</exampleTag>
</ExtendedData>
</Placemark>
</Document>
</kml>Stack Overflow用户
发布于 2015-06-12 10:40:24
到目前为止，这是我使用“自定义”createMarker函数的解决方案，这样你就可以使用和定义你自己的标记属性/选项。
geoXml = new geoXML3.parser({
map: map,
zoom: true,
createMarker: addMyMarker,
singleInfoWindow: true,
suppressInfoWindows: true,
afterParse: useTheData
});
geoXml.parse('exampleMarker.kml');
function addMyMarker(placemark,doc) {
var marker = new google.maps.Marker({
title: placemark.name,
position: placemark.latlng,
map: map,
//This case href is the tag in my KML
icon: placemark.style.icon.href
});
google.maps.event.addListener(marker, 'click', function() {
marker.setAnimation(google.maps.Animation.BOUNCE);
infowindow.setContent(placemark.description);
infowindow.open(map,marker);
});
//doc.markers.push(marker);
return marker;
};
function useTheData(doc){
$.each(doc[0].placemarks, function(index, value) {
//Something
});
};页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/30770188
复制相关文章
相似问题
腾讯云开发者
