diff --git a/packages/visualizations/src/components/MapPoi/Map.ts b/packages/visualizations/src/components/MapPoi/Map.ts index 228de5a3..13ecbec3 100644 --- a/packages/visualizations/src/components/MapPoi/Map.ts +++ b/packages/visualizations/src/components/MapPoi/Map.ts @@ -30,6 +30,9 @@ export default class MapPOI { /** Array of layer IDs that are not from the base style of the map */ private layerIds: string[] = []; + /** Array of source IDs used in the map */ + private sourceIds: string[] = []; + /** A navigation control for the map. */ private navigationControl = new maplibregl.NavigationControl({ showCompass: false }); @@ -97,9 +100,11 @@ export default class MapPOI { /** Event handler for popup close event. */ private onPopupClose() { this.popupFeatures.forEach(({ source, sourceLayer, id }) => { - this.queue((map) => { - map.setFeatureState({ source, sourceLayer, id }, { 'popup-feature': false }); - }); + if (this.sourceIds.includes(source)) { + this.queue((map) => { + map.setFeatureState({ source, sourceLayer, id }, { 'popup-feature': false }); + }); + } }); this.popupFeatures = []; } @@ -126,8 +131,12 @@ export default class MapPOI { // Get the popup configuration for a layer const popupConfiguration = this.popupsConfiguration[layerId]; - // If no popup configuration for a layer, we remove the popup - if (!popupConfiguration) { + /* + * We remove the popup if: + * - no popup configuration for a layer + * - popup's source is no longer used in the map + */ + if (!popupConfiguration || !this.sourceIds.includes(source)) { this.popup.remove(); this.popupFeatures = []; return; @@ -140,7 +149,6 @@ export default class MapPOI { } this.popup.setHTML(getLoadingContent()); - getContent(featureId, properties).then((content) => { this.popup.setHTML(content); }); @@ -207,6 +215,7 @@ export default class MapPOI { }); } this.layerIds = layers.map(({ id }) => id); + this.sourceIds = Object.keys(sources); }); }