I have created a view that lists a listing of nodes, when I try to access the view the following happens every time: A partial part of the view is loaded, though the markers are presented on the whole page (the view is presented full-width and full-height). When I zoom, parts are still greyed out/not loaded, but when I resize the browser window, the whole map loads instantly.

Any ideas why this happens?

Kind regards,
Adam

Comments

knalstaaf’s picture

Are you using some kind of js-related resizing?

The problem is that the resizing of the #map-container div is done via a css transition. The transition hasn't started yet, let alone ended, when the call to invalidateSize happens so the leaflet map cannot recognize any change of dimensions of its surrounding div.

Triggering the map-container-resize event with a delay solved the problem.

(Source)

knalstaaf’s picture

Status: Active » Closed (duplicate)