Tuesday, 3 March 2015

Path using polylines from a xml file on Google map



i try to draw a path from a XML file. I start by the allready answered question by geocodezip, but i can't figured out what is wrong with my code.


Here he is :



function initialize() {
var myLatlng = new google.maps.LatLng(22.291,153.027);
var mapOptions = {
zoom: 5,
center: myLatlng
}

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

downloadUrl("pathxmlfile.xml", function(data) {
var xml = xmlParse(data);
var markers = xml.documentElement.getElementsByTagName("VESSELTRACK");
var bounds = new google.maps.LatLngBounds();
for (var i = 0; i < markers.length; i++) {
var path = [];
var points = markers[i].getElementsByTagName("POSITION");
for (var j = 0; j < points.length; j++) {
var lat = parseFloat(points[j].getAttribute("LAT"));
var lng = parseFloat(points[j].getAttribute("LON"));
var point = new google.maps.LatLng(lat,lng);
bounds.extend(point);
path.push(point);
}

var polyline = new google.maps.Polyline({
path: path,
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
polyline.setMap(map);
}
map.fitBounds(bounds);
});
}

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


And my xml file :



<VESSELTRACK>
<POSITION MMSI="219291000" STATUS="0" SPEED="146" LON="22.291" LAT="153.027" COURSE="189" HEADING="190" TIMESTAMP="2013-07-12T10:06:00"/>
<POSITION MMSI="219291000" STATUS="0" SPEED="146" LON="20.291" LAT="153.498680" COURSE="190" HEADING="191" TIMESTAMP="2013-07-12T10:02:00"/>
<POSITION MMSI="219291000" STATUS="0" SPEED="146" LON="18.291" LAT="153.526649" COURSE="190" HEADING="191" TIMESTAMP="2013-07-12T09:55:00"/>
<POSITION MMSI="219291000" STATUS="0" SPEED="146" LON="17.291" LAT="153.534679" COURSE="189" HEADING="191" TIMESTAMP="2013-07-12T09:52:00"/>
</VESSELTRACK>


Thanks you for your help !


No comments:

Post a Comment