Open Humorloos opened 2 years ago
See https://stackoverflow.com/questions/71113494/openlayers-prevent-pinch-rotate-during-pinch-zoom
implementation mentioned in question:
Index: frontend/src/views/GymMap.vue IDEA additional info: Subsystem: com.intellij.openapi.diff.impl.patch.CharsetEP <+>UTF-8 =================================================================== diff --git a/frontend/src/views/GymMap.vue b/frontend/src/views/GymMap.vue --- a/frontend/src/views/GymMap.vue (revision dc6b1b6253a9e3c217fa312e5a7588f0fae981f6) +++ b/frontend/src/views/GymMap.vue (date 1644851612175) @@ -168,7 +168,7 @@ import {Collection} from 'ol'; import {containsCoordinate, getCenter} from 'ol/extent'; import {GeoJSON} from 'ol/format'; -import {Draw} from 'ol/interaction'; +import {Draw, PinchRotate} from 'ol/interaction'; import {Image as ImageLayer, Vector as VectorLayer} from 'ol/layer'; import Map from 'ol/Map'; import {Projection} from 'ol/proj'; @@ -207,6 +207,10 @@ const map = new Map({ moveTolerance: 4, }); + const interactions = map.getInteractions().getArray(); + const pinchRotate = interactions + .filter((interaction) => interaction instanceof PinchRotate)[0]; + // Mount map and popover watchPostEffect(() => { if (mapRoot.value !== null) map.setTarget(mapRoot.value); @@ -501,12 +505,16 @@ imageLayer.value, vectorLayer, ]); - map.setView(new View({ + const view = new View({ projection: projection.value, center: getCenter(extent), zoom: 1, maxZoom: 8, - })); + }); + view.on('change:resolution', () => { + pinchRotate.setActive(false); + }); + map.setView(view); if (onLoaded) onLoaded(); }; }); @@ -764,6 +772,9 @@ const hit = hasBoulderAtPixel(pixel); map.getTarget().style.cursor = hit ? 'pointer' : ''; }); + map.on('moveend', () => { + pinchRotate.setActive(true); + }); loaded.value = true; }
Maybe it's possible to implement this simlar to the modify interaction: certain zoom triggers zooming property, which is disabled afterwards?
See https://stackoverflow.com/questions/71113494/openlayers-prevent-pinch-rotate-during-pinch-zoom
implementation mentioned in question: