3

I have local tile also 20 level. I found out that OSM tile level 20 don't loading.

map code:

map = new ol.Map({
 target:'map',
 renderer:'canvas',
 view: new ol.View({
    projection: 'EPSG:3857',
    center:[2577400.0, 7007400.0],
    extent:[2567000.5, 7000400.5, 2588377.0, 7014361.0],
    minZoom: 13, maxZoom: 20, zoom:14 })]
  })
}); 

and my osmLayer code:

var osmLayer = new ol.layer.Tile({
       source: new ol.source.OSM({
       url: '../mapy/a_tiles/{z}/{x}/{y}.png'
 })
});

Is there any problem with OSM level 20? In browser devTools I have:

Request URL:http://server/mapy/a_tiles/19/295869/170467.png
Request Method:GET
Status Code:200 OK

despite I just loading 20 level ...

Anybody have any solutions, any ideas?

20-level zoom view:

20-level zoom

19-level zoom view:

19-level zoom

  • Can you create a full working example against the hosted version of OSM tiles. It is hard to debug something coming from a local server. And do you get any useful error messages in the console? – John Powell Dec 18 '15 at 8:55
  • Are you using mapnik? mod_tile? Does level 19 work OK? – BradHards Dec 18 '15 at 8:59
  • BradHards >> Level 19 work perfect. Level 20 work too, but instead tiles from level 20, increases tiles level 19 so I have fuzzy tiles. I see that tiles-20 don't load. But another wmf layer has changes resolution to 20-level. It seems strange - fuzzy OSM base map and clear another wms and wfs layers. I have added some sample pictures above. – Bear Dec 18 '15 at 10:27
  • John Barça "It is hard to debug something coming from a local server" >> Yes I know that, but at my code everything is ok I just wonder if there are some barriers to display 20-level tiles OSM... – Bear Dec 18 '15 at 10:37
5

The ol.source.OSM() class has a default maxZoom option of 19. If you would like to use zoom level 20, you would have to indicate this explicitly in your OSM layer definition.

In your case you would have to change this

var osmLayer = new ol.layer.Tile({
  source: new ol.source.OSM({
    url: '../mapy/a_tiles/{z}/{x}/{y}.png'
  })
});

to this:

var osmLayer = new ol.layer.Tile({
  source: new ol.source.OSM({
    maxZoom: 20,
    url: '../mapy/a_tiles/{z}/{x}/{y}.png'
  })
});
  • You're welcome! Glad to hear that it worked out :) – Sidney Gijzen Dec 18 '15 at 10:46

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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