[GIS] Why does OpenLayers load OSM-like tiles, but does not show them

openlayers-2openstreetmaptiles

I created a tile server with OSM-data in the German style. The data is quite similar to the official tile server for openstreetmap.de, provided by Fraunhofer IOSB.

http://tile.iosb.fraunhofer.de/tiles/osmde/${z}/${x}/${y}.png

If I include the standard OSM-server

http://a.tile.openstreetmap.org/${z}/${x}/${y}.png

with the following constructor

new OpenLayers.Layer.OSM("OSM",myOSMURL,{...});

I get a valid map. The OpenCycleMap tile server works as well.

If I want to use my own tile server or the one from Fraunhofer, the browser successfully gets an respond to the GET-request from the tile server and loads the tiles needed, but doesn't show them in the map.

Following the steps here, I generated a map with local data successfully. Nevertheless, if I replace the link of the local data with a link to Fraunhofer or my tile server, the browser still loads the tiles, but doesn't show them.

// This is the layer that uses the locally stored tiles
//var newLayer = new OpenLayers.Layer.OSM("Local Tiles", "tiles/${z}/${x}/${y}.png", {numZoomLevels: 19, alpha: true, isBaseLayer: false});
var newLayer = new OpenLayers.Layer.OSM("Local Tiles", "http://tile.iosb.fraunhofer.de/tiles/osmde/${z}/${x}/${y}.png", {numZoomLevels: 19, alpha: true, isBaseLayer: false});
map.addLayer(newLayer);
// This is the end of the layer

enter image description here
Image in full resolution: http://i.stack.imgur.com/73jOX.jpg

How do I get the tiles from my tile server or Fraunhofer to my map?

Best Answer

You could use an XYZ layer in Openlayers. This layer should be used in OpenLayers, whenever you have tiles arranged by a standard XYZ grid. This tileset format has been popularized by OSM & then Mapbox.

A Sample is presented here: http://openlayers.org/dev/examples/mapbox.html

For an OSM-like layer you should set the property sphericalMercator: true, so that properties like maxExtent and projectionare set to default values for OSM. For more details see the source code of the XYZ layer.

Related Question