GPX-Track not visible in OSM Map

General talk
1

Hi everyone,

i’m actually planning to replace Google Maps with OSM on one of my websites.
On my website, i display GPX-Tracks on Google Maps. I tried to do the same
thing with OSM. All i want to do is to display the track as a layer on the OSM Map.

Here is my javascript-code:

<script type="text/javascript">
	var lat=51.901746998;
	var lon=10.441233013;
	var zoom=14;
	var map;
	
	function gpx_osm_init() {
	        map = new OpenLayers.Map("map");
		        map.addLayer(new OpenLayers.Layer.OSM());
		var lonLat = new OpenLayers.LonLat(lon, lat).transform(new OpenLayers.Projection("EPSG:4326"), map.getProjectionObject());
		
		var markers = new OpenLayers.Layer.Markers( "Markers" );
		map.addLayer(markers);
			markers.addMarker(new OpenLayers.Marker(lonLat));
			
			map.setCenter(lonLat, zoom);
			var gpxTrackStyle = {strokeColor: "#00FF00", strokeWidth: 2, fillColor: "#00FF00", pointRadius: 5};
			var gpxTrack = new OpenLayers.Layer.Vector("Rammelsberg",{
			protocol: new OpenLayers.Protocol.HTTP
			({
				url: "[http://www.t-muh.de/dev/gpxmap/rammelsberg.gpx](http://www.t-muh.de/dev/gpxmap/rammelsberg.gpx)",
				format: new OpenLayers.Format.GPX()
			}),
			strategies: [new OpenLayers.Strategy.Fixed()],
			style: gpxTrackStyle,
			projection: new OpenLayers.Projection("EPSG:4326")
		});
		
		map.addLayer(gpxTrack);
	}
</script>

When looking at the website, i can see the map with one marker. The map is zoomed to the specified location. Everything seems to work
despite the GPX-Track.

Does anyone of you see the mistake in that code?

I would really appreciate it if someone could spend a bit of his time to help me fix this problem.
Thank you very much.

Bye,
Timo

2

Hi Timo,

did you deploy your webpage to a public server? Could you please post the URL of your Webpage?

Regards

Michael

3

Hi,

of course. Actually, i’m using the code inside a WordPress blog page, but i dont think that makes any difference.
The HTML source code should be okay.

The Link to the page is:

http://dev.t-muh.de/allgemein/gpx-openstreetmap-test/

Bye,

Timo

4

I haven’t looked at the code in detail, but I notice that the web site is at ‘dev.t-muh.de…’ , while the GPX track is at ‘www.t-muh.de…’ . For debug, try storing / referencing both on the same server; the javascript may not allow cross-domain file retrieval.

5

Thanks, that is exactly what went wrong.
I misinterpreted the functionality of the “Protocol.HTTP” object.

The (working) result:

http://dev.t-muh.de/allgemein/gpx-openstreetmap-test/

I guess i have to write some kind of proxy-script arround this so that i can request .gpx-files from other hosts.

Thank you very much.

Bye,

Timo