-
Notifications
You must be signed in to change notification settings - Fork 2.2k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
How to load data after map style is loaded #2268
Comments
Source/layer manipulations can only be done after the style is loaded, so you have to wrap you code in |
http://fuzzytolerance.info/blog/2016/03/16/Leaflet-to-Mapbox-GL/ Use this, this will defiantly work. |
Even if the that event is triggered, your map could be not full ready. myMap.on('style.load', () => {
const waiting = () => {
if (!myMap.isStyleLoaded()) {
setTimeout(waiting, 200);
} else {
loadMyLayers();
}
};
waiting();
}); |
I have been trying to figure out how to do this without a timeout. My issue was the text was not rendering by the time the on load event was called. So instead of using
|
Where is the The timeout hack is error prone by definition. Also, I just learned that if you change the style you lose all the sources, layers, images, etc. you loaded afterwards; and all the solutions to preserve them look also very hacky. Am I missing something? Or a very common task which is loading stuff on top of a basemap is really hard to do properly? |
As for the need to add layers when switching styles, that's a deliberate choice. GL JS regards the style as the declarative source-of-truth for how a map should be rendered. Adding sources and layers which are not in that style and have not been explicitly added to it breaks that paradigm. It might be possible to add an option to allow the retention of sources and layers when switching to a new style, but I don't think GL JS should make that choice on its own. If you have a specific use case that you're having trouble getting set up, you can contact Mapbox Support for guidance. Thanks! |
@ryanhamley Thanks for answering so quickly. What I wrote is the conclusion of my humble experience. I started a few days ago playing with Mapbox and I am delighted about the ease of use and the fantastic documentation. I can feel Leaflet simplicity in most of Mapbox, and coming from OpenLayers everything was heaven so far... until I went into the details. Then in a single day I was stuck with not one, but a few single basic and common tasks which can’t be solved easily and elegantly, and that confused me because of the nice beginnings. Don’t get me wrong, I will find ways of doing everything the right way, but in my experience so far is not easy. And that’s the reason you can see people using those hacky solutions that work 95% of the time. I think that’s a problem, because you should think about the most common scenarios and provide good solutions to them. If Mapbox GL JS is made for performance, why don’t you provide a reliable and documented hook to listen for the style loaded, so you can immediately load your sources and create additional layers while the map is still being rendered? Instead, you have to use Maybe there are underlying technical issues I don’t understand, but from my point of view the “basemap” style and the things you put on top of it usually have nothing to do between them. So why you should have to recreate them if you change the “basemap”? Why do you have to wait for the “basemap” to be fully rendered before you are able to create a source or a layer? Probably these questions are very common for beginners, and impose some limitations that have to be well reasoned. Another example is the In the end I’m only trying to shape my mind to the Mapbox model, which as I said is fantastic in some areas. (By the way, at least the “Add a 3D model” example is using |
Thanks for the thoughtful reply. I hear you and you bring up a lot of valid points. As I noted previously, we understand the need and desire for a reliable, documented version of |
This is certainly not the case now. https://docs.mapbox.com/mapbox-gl-js/example/add-3d-model/ uses style.load. Why these options are being used is not well documented. |
https://docs.mapbox.com/mapbox-gl-js/example/style-switch/ For me it is not clear what is the concrete difference between
load:
So it's "all style resources" vs "all necessary resources"? I'm still confused, when is which more suitable? |
mapbox-gl-js version: latest version
getting error like "Style not done loading" often. Can you please tell me how to avoid this?
The text was updated successfully, but these errors were encountered: