In my Vue serverless web application, I have implemented an OpenLayers map initialized in the mounted lifecycle method. The map is populated with ImageWMS layers that are updated by various functions. After updating the parameters of these layers, I call this.map.renderSync() and attempt to execute another function only when all layers have finished loading and rendering (as indicated by the rendercomplete event). However, I noticed that the callback
this.map.on("rendercomplete",this.myFunction())mounted method. How can I ensure that this.myFunction() is executed only after all layers have been loaded and rendered following parameter updates?
async mounted() {
// Map initialization code
},
methods: {
// Other methods including setTimeSurface10, flagCallback, mapToCanvasList, myCallback
}