How to know when a layer has finished loading

[ArthurGenet]

Hello,

I would like to add a spinner on my map during the time of my layer is loading. The problem is that I have not found any event available where I can know at what time my layer has finished loading.

It seems to be possible with OpenLayers, but I haven't found anything with VueLayers.

Do you know if there is a way to achieve it?

[ghettovoice]

Hello @ArthurGenet , VueLayers provides almost same events as OpenLayers.

Tile sources have: tileloadstart, tileloadend, tileloaderror.

Vector sources: a bit trickle even with OpenLayers. VueLayers v0.11.x:

<vl-source-vector ref="vectorSource" @created="onCreate">

<script>
import { unByKey } from 'ol/Observable'

export default {
  methods: {
    onCreate (vm) {
    // bind right after create
    // also can be a separate method that later call before any change of map view
      const lk = vm.$source.on('change', () => {
        if (vm.$source.getState() == 'ready') {
          unByKey(listenerKey)
        }
      })
    },
  }
}
</script>

VueLayers v0.12.x

<vl-source-vector @update:state="onStateChange" />

[ArthurGenet]

Hello @ghettovoice, thank you very much for your answer, it works amazing (the only weird thing is that the event is triggered multiple times when the layer is removed from the map) and saved my day. Have a nice day :)

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.