Jump to content

Leaflet Map Shrinked - Page Onload Issue ?


Recommended Posts

Hi All,

I have a page organized in tabs, each with its own div.

I have a js that displays a given div when the user clicks the matching tab.

There is a leaflet map in the first div, built from thousands of markers.

There is a login form in the other div.

Displaying a div by clicking its tab works great.

If the user fails the login process, the page is reloaded and he is redirected back to the login div (and a message displays about the error that occured).

Now here is the issue. Suppose the login process fails. If the user clicks the map tab, he will see a badly-formed map, like shrinked in the upper left corner of its container.

My feeling is that the js that deals with the tabs runs before the end of the execution of the js that builds the map.

The body has an onload="init()" associated with the tabs script. Thus I guess the tabs script would run only after the page has loaded.

Since this does not seem to take into accound the map DOM, I tried and found a solution by applying a short settimeout (500 ms) in the tab js, more precisely to the function that grabs the tab links and content divs from the page.

Now if the user fails the login process and clicks the map tab, he will see a well-formed and fully interactive map.

However I think this is just a workaround. Is there a better solution?

Thanks !
Link to comment
Share on other sites

This thread is more than a year old.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.