OpenLayers 7.0 compatibility

walkermatt / ol-layerswitcher

Layer control for OpenLayers

MIT License

384 stars 176 forks source link

OpenLayers 7.0 compatibility #487

Closed vpavic closed 2 years ago

vpavic commented 2 years ago

OpenLayers 7.0 was released recently and trying it out with LayerSwitcher (using the most recent release, 3.8.3) uncovers some incompatibilities. With the very basic examples, this is what I'm seeing:

Uncaught TypeError: class constructors must be invoked with 'new'
    a ol-layerswitcher.js:168

The affected line is this: https://github.com/walkermatt/ol-layerswitcher/blob/5aeaea26dad2b8b508a114c5264d37e0093286d3/dist/ol-layerswitcher.js#L168

walkermatt commented 2 years ago

Thanks for reporting. From a very brief look over breakfast this morning it looks as though removing the transpilation build step (babel) avoids the error. As ol had dropped IE11 support I'll consider the same.

walkermatt commented 2 years ago

Looks like the issue is with the fact that ol-layerswitcher is currently transpiled to ES5 while ol now ships native ES classes. See https://stackoverflow.com/a/51860850/526860.

walkermatt commented 2 years ago

Anyone interested in testing the package I've just published a beta: https://www.npmjs.com/package/ol-layerswitcher/v/4.0.0-beta.1.

Install via npm:

npm i ol-layerswitcher@v4.0.0-beta.1

vpavic commented 2 years ago

Thanks for addressing this. I gave it a spin and it works fine for my use cases.

However, I noticed a couple of style glitches in the examples your repo provides:

side bar overlaps map zoom controls: see side bar example
with click activation mode hide button doesn't have top border: see start with panel active example and hover over hide button

walkermatt commented 2 years ago

I've just published https://www.npmjs.com/package/ol-layerswitcher/v/4.0.0.

I think the issue with the side bar example is due to the side bar component also needing updating to be compatible with ol v7.