How do I clear map from previous style applied

[daniluk4000]

Hey all! I don't get it.

I try to apply Carto basemap styles to map, then change it on theme change.

I have tried:

• Using applyStyle with removeLayer on theme change
• Using apply with layer group change
• Using MapboxVectorLayer and then disposing it & removing from map

No matter how I try, I get this on theme change

It seems like source is cached... somewhere inside ol-mapbox-style.

Is there something we can do to apply completely different style to map? Why is even like this?

Thanks!

[daniluk4000]

Example style url: https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json

I have tried to download it and change source to random name, but that didn't help as well :(

Seems like cache lives in util.js, but we have no control over it

[ahocevar]

The problem is that https://basemaps.cartocdn.com/gl/dark-matter-gl-style/style.json has

  "id": "voyager"

and https://basemaps.cartocdn.com/gl/voyager-gl-style/style.json also has

  "id": "voyager"

ol-mapbox-style caches styles by id to allow for efficient theme switching. If both themes have the same id, that won't work. A workaround is to set the id to the style's url:

  group = new LayerGroup();
  const url = themes[currentTheme];
  fetch(url)
    .then((r) => r.json())
    .then((json) => {
      json.id = url;
      apply(group, json);
      map.addLayer(group);
    });

Here is a working codesandbox with theme switching: https://codesandbox.io/p/sandbox/8nsy64

[daniluk4000]

So I was changing wrong thing then. Thank you!