Synchronize loading across layers and frames

[ibgreen]

Target Use case

For use cases like image and video capture, it is necessary to know if all layers have finished loading. In particular, for tile layers, changes to view state often trigger tile reloads, meaning that the isLoaded state of various layers will go from true to false and then back to true after a while.

Proposed feature

Feature 1: While there is isLoaded support on individual layers, it would be useful to have a deck level function to check if all layers are loaded. This could be a deck.isLoaded() function, or a callback to indicate state change (loading: true or false).

Feature 2: It will also be desirable to have a way to synchronize viewport animation / transitions with this mechanism, to prevent time from advancing until all layers are loaded for the current frame

hubble.gl is the main driver for this request.

To Do List

• [ ] Add label and assign to milestone
• [ ] Coding
• [ ] Doc update
• [ ] What’s new update
• [ ] Test

@Pessimistress @chrisgervang @heshan0131 @igorDykhta

[chrisgervang]

Regarding feature 1, the top-level load state change callback would work better than a function call for my capture use case.

Aside from tile layer, how do other layers behave?

[ibgreen]

If the data prop is a URL (string), they load their data async.

Normally the isLoaded state would only change once (unless you change the data url).

[Pessimistress]

With the current release feature 1 can be achieved by

const areAllLayersLoaded = deck.props.layers.every(layer => layer.isLoaded);

Feature 2 can be achieved by

const {timeline} = deck.animationLoop;

// disable animation/transition
timeline.pause();

// manually advance time
timeline.setTime(nextTick);

[chrisgervang]

@Pessimistress is deck.onAfterRender always called when any layer.isLoaded changes? In my testing this seems to be the case, but the docs don't explicitly mention it.

[Pessimistress]

Theoretically, no. A custom layer could implement isLoaded however it likes.

In practice, all official layers calculate isLoaded from the status of aync fetches, and they all trigger update/redraw when the fetching is done.

[neelduttahere]

Hey @Pessimistress , what would be the best way to assess whether a layer is still loading? To rephrase, is there any other way to access a layer's isLoaded state, without checking deck.props.layers?