Hello everybody,
I have some trouble with the google maps api.
I want to add markers from a xml file to my map but it seems that the function is not parsing my xml file and I am clueless.
Any ideas here is my code:
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="initial-scale=1.0" />
<style type="text/css">
html { height: 100% }
body { height: 100%; margin: 0px; padding: 0px }
#map_canvas { height: 100% }
</style>
<script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
<script type="text/javascript" src="util.js"></script>
<script type="text/javascript">
var map = null;
function load()
{
var latlng = new google.maps.LatLng(-34.397, 150.644);
var option = {
zoom: 8,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById("map_canvas"), option);
createMarker(-34.397, 150.644, 'lol');
downloadUrl("airport.xml", function(data) {
var xml = xmlParse(data);
var markers = xml.documentElement.getElementsByTagName("marker");
document.getElementById("test").innerHTML = markers.length;
for (var i = 0; i < markers.length; i++) {
var info = markers[i].getAttribute("info");
var lat = parseFloat(markers[i].getAttribute("lat"));
var lon = parseFloat(markers[i].getAttribute("lng"));
createMarker(lat, lon, info);
bindInfoWindow(marker, map, infoWindow, html);
}
});
}
function createMarker(lat, lon, info){
var myLatlng = new google.maps.LatLng(lat, lon);
var marker = new google.maps.Marker({
position: myLatlng,
map: map,
title:"info",
icon: "http://google-maps-icons.googlecode.com/files/airport.png"
});
}
</script>
</head>
<body onload="load()">
<div id="map_canvas" style="width:50%; height:50%"></div>
<div id="test" style="width:50%; height:50%">lo</div>
</body>
</html>Life in action: http://e-bro.org/google
It seems that the length = 0 this is strange
greetz