Har fått til det meste selv nå:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml">
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<title>Google Maps - www.vossnow.net</title>
<script src="http://maps.google.com/maps?file=api&v=2&key="
type="text/javascript"></script>
<style type="text/css">
#main_container {
width: 100%;
height: 500px;
float: left;
clear: both;
position: relative;
z-index: 1;
}
#map_container {
height: 100%;
float: left;
position: relative;
}
#sidebar {
width: 270px;
float: left;
}
.html{
width: 100%;
height: 100%;
clip: auto;
position: absolute;
overflow: hidden;
}
#map_canvas {
height: 100%;
width: 100%;
display: block;
position: absolute;
}
</style>
<script type="text/javascript">
var filename= getUrlVars()["file"];
var lon= getUrlVars()["lon"];
var lat= getUrlVars()["lat"];
var zoomh= parseInt(getUrlVars()["zoomh"]);
function getUrlVars() {
var vars = {};
var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
vars[key] = value;
});
return vars;
}
function initialize() {
if (GBrowserIsCompatible()) {
var map = new GMap2(document.getElementById("map_canvas"));
map.setCenter(new GLatLng(lon, lat), zoomh);
var tilelayer = new GTileLayer(null, null, null,
{tileUrlTemplate: 'http://opencache.statkart.no/gatekeeper/gk/gk.open_gmaps?layers=toporaster2&zoom={Z}&x={X}&y={Y}',
isPng:true,
opacity:1.0 }
);
var myTileLayer = new GTileLayerOverlay(tilelayer);
map.addOverlay(myTileLayer);
map.addControl(new GLargeMapControl());
GDownloadUrl(filename, function(data, responseCode) {
var points=[];
var xml = GXml.parse(data);
var markers = xml.documentElement.getElementsByTagName("trkpt");
var firstPoint=new GLatLng(parseFloat(markers[0].getAttribute("lat")),
parseFloat(markers[0].getAttribute("lon")));
var lastPoint=firstPoint
for (var i = 1; i < markers.length; i++) {
var newPoint=new GLatLng(parseFloat(markers.getAttribute("lat")),
parseFloat(markers.getAttribute("lon")));
if(newPoint.distanceFrom(lastPoint)>20) {
points.push(newPoint);
lastPoint=newPoint;
}
}
map.addOverlay(new GPolyline(points, "blue", 5));
});
}
}
</script>
</head>
<center>
<body onload="initialize()" onunload="GUnload()">
<div id="map_canvas"></div>
<div id="message"></div>
</body>
</html>
