React-leaflet: maxZoom > 19 renders gray tiles on max zoom

[Eightyplus]

Please make sure to check the following boxes before submitting an issue. Thanks!

• [X] All peer dependencies are installed: React, ReactDOM and Leaflet.
• [X] Using a supported version of React and ReactDOM (v15.0.0+).
• [X] Using the supported version of Leaflet (v1.0.0) and its corresponding CSS file is loaded.
• [X] Using the latest version of React-Leaflet.
• [X] The issue has not already been reported.
• [X] Make sure you have followed the quick start guide for Leaflet.
• [X] Make sure you have fully read the documentation and that you understand the technical considerations.

Expected behavior

I want to change the zoom level on "

Actual behavior

When I set maxZoom beyond zoom level 19 the tiles are not fetched from the leaflet map/tile server. And the Leafletmap component renders gray tiles (because the tiles are not fetched).

Steps to reproduce

1. set maxZoom={20} or more on
2. zoom in to the map cannot be zoom more
3. map turns gray

Demo: https://jsfiddle.net/vfa15L8c/8/

[PaulLeCam]

Hi,
Could you provide the similar demo with Leaflet only please to compare the behavior?

[Eightyplus]

Oh, the same thing occurs with leaflet.

http://jsfiddle.net/friesgaard/d9q9wzwf/

[Eightyplus]

But here I get an 404, which I didn't see when using react-leaflet.

[Eightyplus]

After updating the map server on our behalf to a higher zoom level, I must conclude it works in leaflet and not in react-leaflet.

React-leaflet
https://jsfiddle.net/friesgaard/vfa15L8c/10/

leaflet
http://jsfiddle.net/vk2m5hha/

[Eightyplus]

_layersMaxZoom is not set eventough maxZoom is set.

[Eightyplus]

It work when maxZoom={20} is also set on

https://jsfiddle.net/friesgaard/vfa15L8c/11/

According leaflet documentation, setting maxZoom on map "overrides any maxZoom set on map layers"...
http://leafletjs.com/reference.html#map-maxzoom

[PaulLeCam]

Hi, thanks for all the details, it helped a lot!
I don't know what's the exact cause of the issue, as there is no logic trying to alter Leaflet's one, but I pushed a workaround to master that makes all tile layers inherit the maxZoom and minZoom properties from the map.
Could you please try the code from the latest master and check if it solves your issue?

[Eightyplus]

Great it helped, took some debugging and guesswork. Your fix has solved the issue.

[PaulLeCam]

Now published in v1.1.2.

[ayozebarrera]

Hi, still happening to me with ^1.9.1 and I'm ussing maxZoom property.

Btw, just checked v2 example on codesandbox and updating it with maxZoom={19} will break too!
What I missing?

Thanks!

[NeoLegends]

I'm also facing this issue here, I'm using react-leaflet v2.1.2. As soon as I zoom to max zoom level the tiles disappear and the img DOM nodes are unmounted. It doesn't matter where I set the max zoom level to, as soon as I hit it, the tiles disappear.

Any ideas?