MapBox event when all Tiles are loaded

Question

I'm using Mapbox GL JS API to manipulate a Mapbox map. Right before I upload my result (which is a canvas.toDataURL) to the server through HTTP I need to resize my map (bigger resolution) and then use fitbounds to get back to the original points. After fit bounds fires, it takes the map a while to load all new tiles in. Only after this can I actually perform the upload. Right now though, I don't know if there's an event that's capable of telling me if all tiles are loaded.

I've tried all possible load functions and events in the API. There's a few issues on the GITHUB project but they're now at least a year old and there's been no update. Halfway through 2015 they started talking about adding an Idle event, but I can't seem to find any new documentation of it anywhere.

Has anyone found a way to make the code wait for the map to load? Or has any information regarding an update on this feature?

I doubt it matters much, but I'm working in an angular.js app.

Answer 1

We just added a Map#areTilesLoaded check which sounds like what you're looking for. That should go out in the next release (v0.37.0). In the meantime, the following should work.

map.on('sourcedata', (e)=> {
    if (map.loaded()) {
     // all tiles are loaded 

     // turn off sourcedata listener if its no longer needed
     map.off('sourcedata');
    }
});