diff --git a/examples/Interaction/InteractionExample.vue b/examples/Interaction/InteractionExample.vue index a6d8a098..07034627 100644 --- a/examples/Interaction/InteractionExample.vue +++ b/examples/Interaction/InteractionExample.vue @@ -10,7 +10,7 @@ const { zoomOnPinch, panOnScroll, panOnScrollMode, - paneMoveable, + paneMovable, onConnect, onNodeDragStart, onNodeDragStop, @@ -28,6 +28,7 @@ const { { id: 'e1-2', source: '1', target: '2', animated: true }, { id: 'e1-3', source: '1', target: '3' }, ], + panOnScroll: true, }) const captureZoomClick = ref(false) @@ -101,8 +102,8 @@ onMoveEnd((flowTransform) => console.log('move end', flowTransform))
diff --git a/src/container/ZoomPane/ZoomPane.vue b/src/container/ZoomPane/ZoomPane.vue index bd7ca5eb..ad5ec7f4 100644 --- a/src/container/ZoomPane/ZoomPane.vue +++ b/src/container/ZoomPane/ZoomPane.vue @@ -143,7 +143,7 @@ onMounted(async () => { // if zoom on double click is disabled, we prevent the double click event if (!store.zoomOnDoubleClick && event.type === 'dblclick') return false - if (noWheel(event) && event.type === 'wheel') return false + if ((!store.zoomOnScroll || noWheel(event)) && event.type === 'wheel') return false // when the target element is a node, we still allow zooming if (