brunob / leaflet.fullscreen

Leaflet.Control.FullScreen for Leaflet
https://brunob.github.io/leaflet.fullscreen/
MIT License
380 stars 110 forks source link

add delay for map.invalidateSize() call to avoid some lags detected #51

Closed trash0000 closed 7 years ago

trash0000 commented 8 years ago

I've discovered problems for Chrome in mobile device emulation mode: map.getSize() get wrong value after switching to fullscreen mode. Adding delay like this setTimeout(L.bind(map.invalidateSize, map), 200); solve my problem. So I wish it helps another ones.

brunob commented 7 years ago

@trash0000 thx for pathc, does the bug still occurs whit latest leaflet version ?

trash0000 commented 7 years ago

does the bug still occurs whit latest leaflet version ?

don't know. Bug was detected for Leaflet 0.7.7 with map contains huge amount of vector objects (~100 lines and rectangles). But I think this problem also was actual for Leaflet 1.0.2

I think that on switching to fullscreen mode Browser (e.g Chrome) is recalculating actual sizes for whole DOM structure. And this is long process for map with complicated vector layer (SVG). When the leaflet.fulscreen plugin calls "map.invalidateSize" the recalculation DOM has not completed yet. So map.invalidateSize got old size for div#map element and caches these values (see leaflet-src.js for details).

The given solution make deleyed call with "setTimeout to 200ms" to ensure that browser finished recalculating DOM. I think that this enchancement (by the same reason) helps to solve problem: https://github.com/brunob/leaflet.fullscreen/issues/48 related to this plugin