Find file
Fetching contributors…
Cannot retrieve contributors at this time
86 lines (80 sloc) 2.46 KB
<!doctype html>
<html>
<head>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=7; IE=EmulateIE9; IE=10" />
<meta name="keywords" content="loadXMLFile,parseXML,onXMLLoadFailed" />
<title>HERE Maps API Example: Loading Marker Data from an XML file</title>
<!-- Set up constants such as APP ID and token -->
<script type="text/javascript" src="../libs/hereAppIdAndToken.js"></script>
<!-- Bootstrap jQuery Library -->
<script type="text/javascript" src="../libs/jQl.min.js"></script>
<!-- Asynchronously the HERE Maps API for JavaScript -->
<script type="text/javascript" src="../libs/hereAsyncLoader.js"
id="HereMapsLoaderScript"
data-params="maps,datarendering"
data-map-container="mapContainer"
data-callback="afterHereMapLoad" >
</script>
<link rel="icon" href="http://here.com/favicon.ico"/>
<!--<link href="http://developer.here.com/html/css/main.css" rel="stylesheet" />-->
</head>
<body>
<h1>Loading XML Marker Data using AJAX</h1>
<p>This example retrieves marker data from an XML file using AJAX.
The data is held in a proprietory format and parsed using jQuery.
</p>
<p>The XML file is located at:
<a href="./data/markers.xml">./data/markers.xml</a>
</p>
<div id="mapContainer" style="width:540px; height:334px;"></div>
<script id="example-code" data-categories="marker,xml" type="text/javascript" >
//<![CDATA[
var map,
container;
function parseXML(xml) {
var nme,
lat,
lng,
markerCoords;
container = new nokia.maps.map.Container();
$(xml).find('marker').each(function () {
//Read the name, address, latitude and
// longitude for each Marker
nme = $(this).find('name').text();
lat = $(this).find('lat').text();
lng = $(this).find('lng').text();
markerCoords = new nokia.maps.geo.Coordinate(
parseFloat(lat, 10),
parseFloat(lng, 10)
);
container.objects.add(new nokia.maps.map.StandardMarker(
markerCoords,
{text: nme}
));
});
map.objects.add(container);
map.zoomTo(container.getBoundingBox(), false);
}
function onXMLLoadFailed() {
alert('An Error has occurred.');
}
function loadXMLFile() {
var filename = './data/markers.xml';
$.ajax({
type: 'GET',
url: filename,
dataType: 'xml',
success: parseXML,
error : onXMLLoadFailed
});
}
function afterHereMapLoad(theMap) {
map = theMap;
loadXMLFile();
}
//]]>
</script>
<script type="text/javascript" src="../libs/prettyprint.js"></script>
</body>
</html>