Hey,We are moving to the OutSystems Maps, and when using the Leaflet version the tiles won't load correctly initially:
But once we resize the browser window the tiles suddenly load and everything is as it's supposed to be.On this map, we have Markers and Polygon lines, but besides that we are not really doing anything else:
The container that holds the map does not have any styling.
We have tried to change the Zoom, the center position, the height, but this always happens.We hit kind of a road block with this.Looks like that there are also posts with this issue in StackOverflow but none of the solutions we found actually solved this problem:https://stackoverflow.com/questions/53879753/leaflet-map-does-not-appear-correctly-until-resize
Update: Even without markers/polygon lines the tiles still only load after a window resize.
Thank you,Luís Almeida
Hi @Luís Almeida
Any feedback on this topic? Since we have no feedback from you in order to provide feedback on the purposed workaround, I take the opportunity to inform you that we managed to fix this on our end and will be released in OutSystems Maps 1.6.2.
Best Regards,GM
Hi Luís
Could you please share a sample OML and the steps to reproduce it?Thank you in advance.
Cheers,GM
Yes of course!Hopefully you can also replicate it.I included 2 screens, 1 where the tiles don't load:
and another where they do.
But the solution I have does not seem optimal at all, and I noticed that it created some unintended behavior such as resetting the zoomThis is the scenario that we have, were we are loading maps inside tabs, and currently we have 3 tabs and each one of them has 1 map.Thank you,Luís Almeida
I can't replicate 100% of the time but I was able to replicate.We'll try to understand what's happening and once I have news I'll reach out.
EDIT: This seems to be an issue on the library as mentioned here so will try to provide a workaround for a future release
On a quick test, I using our API, I was able to make it work by calling an API method on the Map_Initialized event (in the case of the Tabs you need to do the same on the TabChange event):
This is not a fix but it should unblock your use case.
Check a sample attached based on the module you shared.
Any feedback on this topic?
EDIT: By the way the API call for version 1.6.0 should be the following instead:
MapAPI.MapManager.GetMapById("LeafletMap1").updateHeight();