BetterTyped/react-zoom-pan-pinch

wheel step prop doesnt work

Opened this issue · 1 comments

MartinArauz commented

Describe the bug
I have an svg with many paths. I'm testing the step property of weel, but it doesn't alter the zoom sensitivity in any way:

<TransformWrapper
initialScale={6.0}
initialPositionX={initialPosition.x}
initialPositionY={initialPosition.y}
minScale={1}
disabled={false}
limitToBounds={true}
onZoom={(value) => handleZoom(value)}
wheel={{step: 0.5}}

Desktop (please complete the following information):

  • OS: Windows 11
  • Browser Chrome
  • Version 126.0.6478.127
rohmunen commented

I've recently ran into this. I think it's because smooth prop is set to true by default. So to achieve what you want you can try altering smoothStep instead of step: wheel={{ smoothStep: 0.5 }}. Another way is to change smooth prop on TransformWrapper to false and keep wheel={{step: 0.5}} prop.

reference: https://bettertyped.github.io/react-zoom-pan-pinch/?path=/docs/docs-props--page

  • 👍1