From b675c9f6b308f8ea05de47cd6f20c54fa1dccb5b Mon Sep 17 00:00:00 2001 From: Jessica McInchak Date: Fri, 14 Jan 2022 11:44:05 +0100 Subject: [PATCH] fix: add prop to set unique id on element & clear the featureSource unless `clickFeatures` is enabled (#110) --- index.html | 2 +- src/my-map.ts | 25 +++++++++++++++---------- src/os-features.ts | 36 ++++++++++++++++++++++++++---------- 3 files changed, 42 insertions(+), 21 deletions(-) diff --git a/index.html b/index.html index 26c0ff4..5bf9c22 100644 --- a/index.html +++ b/index.html @@ -14,7 +14,7 @@ /> - + -
`; +
`; } // unmount the map diff --git a/src/os-features.ts b/src/os-features.ts index 9a340b0..cb81be3 100644 --- a/src/os-features.ts +++ b/src/os-features.ts @@ -33,8 +33,13 @@ export function makeFeatureLayer(color: string, featureFill: boolean) { * features containing the coordinates of the provided point * @param coord - xy coordinate * @param apiKey - Ordnance Survey Features API key, sign up here: https://osdatahub.os.uk/plans + * @param supportClickFeatures - whether the featureSource should support `clickFeatures` mode or be cleared upfront */ -export function getFeaturesAtPoint(coord: Array, apiKey: any) { +export function getFeaturesAtPoint( + coord: Array, + apiKey: any, + supportClickFeatures: boolean +) { const xml = ` @@ -82,17 +87,28 @@ export function getFeaturesAtPoint(coord: Array, apiKey: any) { featureProjection: "EPSG:3857", }); - features.forEach((feature) => { - const id = feature.getProperties().TOID; - const existingFeature = featureSource.getFeatureById(id); - - if (existingFeature) { - featureSource.removeFeature(existingFeature); - } else { + if (supportClickFeatures) { + // Allows for many features to be selected/deselected when `showFeaturesAtPoint` && `clickFeatures` are enabled + features.forEach((feature) => { + const id = feature.getProperties().TOID; + const existingFeature = featureSource.getFeatureById(id); + + if (existingFeature) { + featureSource.removeFeature(existingFeature); + } else { + feature.setId(id); + featureSource.addFeature(feature); + } + }); + } else { + // Clears the source upfront to prevent previously fetched results from persisting when only `showFeaturesAtPoint` is enabled + featureSource.clear(); + features.forEach((feature) => { + const id = feature.getProperties().TOID; feature.setId(id); featureSource.addFeature(feature); - } - }); + }); + } outlineSource.clear(); outlineSource.addFeature(