Side bar example: How to integrate Sidebar function in ol7/ol-layerswitcher 4.1.1

[pggsn]

Hi Matt,

I am trying to integrate your side bar (incl. layer switcher) example into my scripts. However, I receive an "uncaught ErrorType: Cannot read properties of indefined (reading 'pointerEvents')" error message.

This is my code in the main.js:

import "./node_modules/ol-sidebar/ol-sidebar.css";
import Sidebar from 'ol/control/Control.js';

...

const sidebar = new Sidebar({
    element:'sidebar',
    position: 'left'
});

const sb = document.getElementById('layers');
LayerSwitcher.renderPanel(map, sb, { reverse: true });
map.addControl(sidebar);

ol-sidebar.css and ol.sidebar.js is copied from your example and saved in a folder in node_modules.

Do you have any idea what the problem is? Is it probably the import of the sidebar class?

Thank you and best regards, Kim

[walkermatt]

Hi, I've had a play with this and have pulled together a sandbox which demonstrates using the sidebar with the layerswitcher.

In order to import the Sidebar class I had to update ol-sidebar to be a module and export the Sidebar class.