From eace34fd3ab79c1c5842b0c0772b07af6fd7daa2 Mon Sep 17 00:00:00 2001 From: Dennis Sen Date: Fri, 31 Jan 2025 07:41:29 +0100 Subject: [PATCH 1/3] fix that drawings on top of each other were glued Fix source: https://github.com/openlayers/openlayers/issues/16593#issuecomment-2624257614 --- packages/plugins/Draw/CHANGELOG.md | 1 + packages/plugins/Draw/src/store/actions.ts | 6 ++- .../createModifyInteractions.ts | 49 ++++++++++++++++++- 3 files changed, 53 insertions(+), 3 deletions(-) diff --git a/packages/plugins/Draw/CHANGELOG.md b/packages/plugins/Draw/CHANGELOG.md index 6e634822a..c6492c4ab 100644 --- a/packages/plugins/Draw/CHANGELOG.md +++ b/packages/plugins/Draw/CHANGELOG.md @@ -5,6 +5,7 @@ - Feature: Add new configuration parameter `measureOptions` to allow users to select a measurement mode when drawing a feature. This way, a length / area in the selected unit is added to the drawn feature. - Fix: Update initial value of `drawMode` to a selectable value if the default `Point` is not a drawable option. - Fix: Adjust type `DrawGetters` regarding its keys `selectableDrawModes` and `selectableModes` to correctly reflect that they represent objects. +- Fix: Stacked geometries can be separated with the "Edit" operation again. [Thanks to mike-000](https://github.com/openlayers/openlayers/issues/16593#issuecomment-2624257614). - Chore: Add `@polar/core` as a dependency as the component `RadioCard.vue` has been moved from this package to `@polar/core`. ## 2.0.0 diff --git a/packages/plugins/Draw/src/store/actions.ts b/packages/plugins/Draw/src/store/actions.ts index 59a9a686b..b1dc2000e 100644 --- a/packages/plugins/Draw/src/store/actions.ts +++ b/packages/plugins/Draw/src/store/actions.ts @@ -130,7 +130,11 @@ export const makeActions = () => { getters: { selectedFeature }, rootGetters: { map }, }) { - interactions.forEach((interaction) => map.removeInteraction(interaction)) + interactions.forEach( + (interaction) => + // @ts-expect-error | "un on removal" riding piggyback as _onRemove + map.removeInteraction(interaction) && interaction._onRemove?.() + ) if (interactions.some((interaction) => interaction instanceof Select)) { if (selectedFeature && selectedFeature.get('text') === '') { // text nodes without text are considered deleted diff --git a/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts b/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts index 194186507..5aff2477f 100644 --- a/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts +++ b/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts @@ -1,10 +1,55 @@ import { Modify, Select, Snap } from 'ol/interaction' import Interaction from 'ol/interaction/Interaction' import { PolarActionContext } from '@polar/lib-custom-types' +import { Collection, Feature, MapBrowserEvent } from 'ol' +import { Geometry } from 'ol/geom' import { CreateInteractionsPayload, DrawGetters, DrawState } from '../../types' +const createModify = ( + rootGetters: PolarActionContext['rootGetters'], + drawLayer: CreateInteractionsPayload['drawLayer'] +) => { + let active = false + const features: Collection> = new Collection() + const modify = new Modify({ features }) + modify.on('modifystart', () => { + active = true + }) + modify.on('modifyend', () => { + active = false + }) + + const localSelector = (e: MapBrowserEvent) => { + if (!active) { + rootGetters.map.forEachFeatureAtPixel( + e.pixel, + (f) => { + if (f !== features.item(0)) { + features.setAt(0, f as Feature) + } + return true + }, + { + layerFilter: (l) => l === drawLayer, + } + ) + } + } + + rootGetters.map.on('pointermove', localSelector) + // @ts-expect-error | "un on removal" riding piggyback as _onRemove + modify._onRemove = () => rootGetters.map.un('pointermove', localSelector) + + return modify +} + export default function ( - { commit, dispatch, getters }: PolarActionContext, + { + commit, + dispatch, + getters, + rootGetters, + }: PolarActionContext, { drawSource, drawLayer }: CreateInteractionsPayload ): Interaction[] { const { drawMode } = getters @@ -40,7 +85,7 @@ export default function ( }) return [ - new Modify({ source: drawSource }), + createModify(rootGetters, drawLayer), new Snap({ source: drawSource }), select, ] From 3b7282822a44148479502b7bad0b01b71c892d58 Mon Sep 17 00:00:00 2001 From: Dennis Sen Date: Mon, 3 Feb 2025 13:16:31 +0100 Subject: [PATCH 2/3] remove redundant type --- .../src/store/createInteractions/createModifyInteractions.ts | 5 ++--- 1 file changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts b/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts index 5aff2477f..218d2afe2 100644 --- a/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts +++ b/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts @@ -2,7 +2,6 @@ import { Modify, Select, Snap } from 'ol/interaction' import Interaction from 'ol/interaction/Interaction' import { PolarActionContext } from '@polar/lib-custom-types' import { Collection, Feature, MapBrowserEvent } from 'ol' -import { Geometry } from 'ol/geom' import { CreateInteractionsPayload, DrawGetters, DrawState } from '../../types' const createModify = ( @@ -10,7 +9,7 @@ const createModify = ( drawLayer: CreateInteractionsPayload['drawLayer'] ) => { let active = false - const features: Collection> = new Collection() + const features: Collection = new Collection() const modify = new Modify({ features }) modify.on('modifystart', () => { active = true @@ -25,7 +24,7 @@ const createModify = ( e.pixel, (f) => { if (f !== features.item(0)) { - features.setAt(0, f as Feature) + features.setAt(0, f as Feature) } return true }, From 0051fff73b0df1c5ea6c61c80cce3ea678e4d067 Mon Sep 17 00:00:00 2001 From: Dennis Sen Date: Mon, 3 Feb 2025 13:21:30 +0100 Subject: [PATCH 3/3] change function API, change function usage --- .../createInteractions/createModifyInteractions.ts | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts b/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts index 218d2afe2..9334a65a6 100644 --- a/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts +++ b/packages/plugins/Draw/src/store/createInteractions/createModifyInteractions.ts @@ -1,11 +1,11 @@ import { Modify, Select, Snap } from 'ol/interaction' import Interaction from 'ol/interaction/Interaction' import { PolarActionContext } from '@polar/lib-custom-types' -import { Collection, Feature, MapBrowserEvent } from 'ol' +import { Collection, Feature, Map, MapBrowserEvent } from 'ol' import { CreateInteractionsPayload, DrawGetters, DrawState } from '../../types' const createModify = ( - rootGetters: PolarActionContext['rootGetters'], + map: Map, drawLayer: CreateInteractionsPayload['drawLayer'] ) => { let active = false @@ -20,7 +20,7 @@ const createModify = ( const localSelector = (e: MapBrowserEvent) => { if (!active) { - rootGetters.map.forEachFeatureAtPixel( + map.forEachFeatureAtPixel( e.pixel, (f) => { if (f !== features.item(0)) { @@ -35,9 +35,9 @@ const createModify = ( } } - rootGetters.map.on('pointermove', localSelector) + map.on('pointermove', localSelector) // @ts-expect-error | "un on removal" riding piggyback as _onRemove - modify._onRemove = () => rootGetters.map.un('pointermove', localSelector) + modify._onRemove = () => map.un('pointermove', localSelector) return modify } @@ -84,7 +84,7 @@ export default function ( }) return [ - createModify(rootGetters, drawLayer), + createModify(rootGetters.map, drawLayer), new Snap({ source: drawSource }), select, ]