animate and zoomWithWheel together doesn't work well

[YanDevDe]

Describe the bug

Using {animate: true} as config and using zoomWithWheel will shift the position if you're scrolling very quickly.

Your environment

• Version of panzoom: 4.3.2
• Browser and browser version: Brave Browser Version 1.14.84 Chromium: 85.0.4183.121 (Official Build) (64-bit)

This issue also appears on Chrome as well.

Expected behavior

Smooth zoom with scrolling without shifting the position

Actual behavior

If shifts if you scroll very quickly.

Steps to reproduce

Add {animate: true} at Panzoom config and use wheel listener with .zoomWithWheel

Example

https://jsbin.com/lelujesece/1/edit?html,css,js,output

[timmywil]

Thanks for opening an issue. This has to do with the async nature of Panzoom. Best thing to do is not use animate when zooming with the mouse wheel.

[tmladek]

Hi, I've ran into the same issue, it's a pity! Is there no other workaround?

Also, I am not entirely sure it is entirely about Panzoom being async; if I do not animate and simply zoom to a single point repeatedly, every once in a while, the (SVG) element seems to shift slightly, usually at fairly high zoom levels. Could this maybe be related?