html5-canvasopenlayersangular-openlayers

Remove event context canvas render when finished


I'm using OpenLayers to compare two Vector Layers. One Layer is the main layer and gets loaded with the map the other layer get's loaded after when I want to compare the 2 layers. (Desired behavior) When I am done comparing I want to go back to the initial state of the map but (Problem) I can't seem to get rid of the canvas "slices" that were created when comparing.

I've created a demo of the code here (Code Sample)

https://codesandbox.io/s/layer-swipe-compare-uceihq?file=/main.js

minus the removing the "slices" and going back to the original state.


Solution

  • You need to unset the prerender and postrender listeners and remove the layer that you added (which should be created only once).

    https://codesandbox.io/s/layer-swipe-compare-forked-muihye?file=/main.js