1

I am trying to cache a GeoServer layer with MapProxy and display it on an OpenLayers4 map. I created a new MapProxy grid in UTM32N and in the MapProxy preview the layer is shown nicely, but when I add it to my ol map, it won't display at all. Requests are sent but return empty tiles.

I have tried several grid definitions, two are shown below ("utm32n" and "germany") in the mapproxy config:

services:
  demo:
  tms:
    use_grid_names: true
    origin: 'sw'

layers:
  - name: mylayer
    title: mytitle
    sources: [mysource]
caches:
  mylayer:
    grids: [webmercator, germany]
    sources: [mysource]

sources:
  mylayer:
    type: wms
    req:
      url: http://mygeoserver/ws/wms
      layers: mylayer
      transparent: true

grids:
    utm32n:
        srs: EPSG:25832
        bbox: [239323.44497139292,4290144.074117256,760676.555028607,9503675.174689397]
        bbox_srs: EPSG:25832
        origin: sw
        min_res: 156367.7919628329
        num_levels: 18
    germany:
      srs: 'EPSG:25832'
      bbox: [6, 47.3, 15.1, 55]
      bbox_srs: 'EPSG:4326'
      origin: 'sw'

In my ol map, I have tried to define the layer as ol.source.TileImage:

var extent = ol.proj.transformExtent([6, 47.3, 15.1, 55], "EPSG:4326", epsg_code);
var size = ol.extent.getWidth(extent) / 256;
var no_zoomlevels = map.getView().getMaxZoom() - map.getView().getMinZoom() + 1;
var resolutions = new Array(no_zoomlevels);
for(var i=map.getView().getMinZoom(); i<=map.getView().getMaxZoom(); i++){
    resolutions[i] = map.getView().getResolutionForZoom(i);
}
var layer = new ol.layer.Tile({
    name: name,
    source: new ol.source.TileImage({
        projection: epsg_code,
        tileGrid: new ol.tilegrid.TileGrid({
            resolutions: resolutions,
            extent: extent,
            origin: [extent[0], extent[1]],
            minZoom: map.getView().getMinZoom(),
        }),
        tileUrlFunction: function(tileCoord, pixelRatio, projection){
            var z = tileCoord[0];
            var x = tileCoord[1];
            var y = - tileCoord[2];
            var url = 'http://mymapproxy/tms/1.0.0/mylayer/germany/' + z + '/' + x + '/' + y + '.png';
            return url;
        }
    }),
});

as well as ol.source.XYZ:

...
source: new ol.source.XYZ({
    url: 'http://mymapproxy/tms/1.0.0/' + name + '/germany/{z}/{x}/{-y}.png',
    projection: epsg_code,
    minZoom: map.getView().getMinZoom(),
    maxZoom: map.getView().getMaxZoom(),
}),
...

It seems like the ol grid and the mapproxy grid are not the same, but how do I match them?

1 Answer 1

2

I finally made it work with this configuration:

I put the transformed bbox into the grid-definition and set the min_res to the openlayers-resolution of zoom level 0 in mapproxy.yaml:

grids:
  germany:
    srs: 'EPSG:25832'
    bbox: [273211.2532533697, 5242868.243936263, 961083.6232988155, 6111822.37943825]
    origin: 'sw'
    min_res: 156367.7919628329
    num_levels: 18

In my ol map, I defined the source like this (extent and resolutions are exactly the same as in mapproxy):

var extent = [273211.2532533697, 5242868.243936263, 961083.6232988155, 6111822.37943825];
var resolutions = [];
for(var i=map.getView().getMinZoom(); i<=map.getView().getMaxZoom(); i++){
  resolutions[i] = map.getView().getResolutionForZoom(i);
}
var source = new ol.source.TileImage({
  projection: 'EPSG:25832',
  tileGrid: new ol.tilegrid.TileGrid({
    resolutions: resolutions,
    extent: extent,
    origin: [extent[0], extent[1]],
    minZoom: map.getView().getMinZoom(),
  }),
  tileUrlFunction: function(tileCoord, pixelRatio, projection){
    var z = tileCoord[0];
    var x =  tileCoord[1];
    var y =  tileCoord[2];
    var url = 'http://mymapproxy/tms/1.0.0/mylayer/germany/' + z + '/' + x + '/' + y + '.png';
    return url;
  },
});

Probably there are other ways and I still don't understand completely how these grids work, but I set my focus on synchronizing the two grids. Apparently, the transformation of mapproxy & openlayers/proj4js is not exactly the same, as the grid was slightly shifted before I defined the extent directly in UTM coordinates (calculated by ol/proj4).

I hope, this might help someone with similar problems sometime...

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.