Panzoom: Pinch zoom not working on Android Chrome 55

I can confirm that pinch-zoom has stopped working entirely in chrome 55 as well. I wish I had the coding knowledge to even attempt a fix.

I have the same problem. With 3.2.2 but it seems to work on some devices and not on others. For example Samsung on Android 6.0.1 with Chrome 55 does not work while exactly the same Android and Chrome on Nexus device works perfectly.

Same problem here. You can check ti online. Choose one of the first options. When the image loades, pinch to zoom is not working in mobile.

https://yagolopez.github.io/Webcams_de_Asturias/www/#/app/meteo

Please, fix it soon.

Correction:

With the lastest version of jquery and panzoom it seems to work applying this hack:

https://github.com/timmywil/jquery.panzoom/issues/303#issuecomment-267853623

I wonder if someone could help me with my dilemma: I've been using version 2.0.5 for two years, and it works perfectly in my mobile website and phonegap app. The only problem is pinch to zoom in Android Chrome 55

I can get pinch to zoom working in version 3.2.2 by commenting out the line noted in #303. The problem is that 3.2.2 introduces sizing and positioning issues, and setMatrix() adds apparently spurious translations. There are several open issues in this system, and several attempts to fix 3.2.2, but it doesn't seem as stable as 2.0.5. (Excepting only the Chrome 55 issue.)

I've tried replacing event.pageX with event.originalEvent.pageX and event.pageY with event.originalEvent.pageY in 2.0.5 (as bodgybrothers suggest in #303 for version 3.2.2,) but it doesn't fix it, and I'm not competent to go any further trying to get 2.0.5 to work with pinch zoom on Android Chrome 55.

My best outcome would be for 2.x to get fixed, but I don't know if its still actively developed. In the absence of a fix for 2.x it looks like my only option is to wait for a new release of 3.x (4?) that lacks the positioning problems that people are submitting changes for.

Can any kind person add any thoughts or information to aid my decision?
Cheers
John

I also faced the positioning issue by updating to version 3.2.2.
I sorted it by adding height and width to my zoom container.
For me this worked.

position:relative; height:100%; transform:matrix(1, 0, 0, 1, 0, 0); transform-origin: 50% 50% 0;

It seems Chrome 55 fires both touch and pointer events. One ugly fix that works for me is by removing the pointerdown listener. So line 940 becomes:

var str_down;
if (getChromeVersion() >= 55 && 'ontouchstart' in window) {
    str_down = 'mousedown' + ns + ' MSPointerDown' + ns;
}
else {
    str_down = 'mousedown' + ns + ' pointerdown' + ns + ' MSPointerDown' + ns;
}

See http://stackoverflow.com/a/4900484/424563 for getChromeVersion() impl.

Tested with latest jQuery.

@dagged: Thanks for that, but I'm finding that pinch zoom on Chrome 55 works fine on Panzoom 3.2.2 with the fix in #303:
Had a quick hack in the code and commenting out line 1164: this.panning = true;
My problem with Panzoom 3.2.2 is that positioning is messed up, which in my app the fix above suggested by @pravid doesn't seem to fix (thank you anyway pravid.)

@dagged
in my case, #303 workaround not working on android 6 samsung Galaxy S6.
your workaround works great!!! save my days. Thanks!!!

@dagged you are the saviour. Thanks!!!

@nich008
2.0.5 bug is window.PointerEvent is true.
so hide line 32-39, line 74; line 80 var pointerEvents = false;
use touch event no pointer

@chfeizy
On first look that seems to fix it. Thanks!!!
[edit] Yes - its working well - thank you.

Duplicate of #303

@jcnventura : This issue was raised on Panzoom version 2.0.5 so is not strictly a dupe of #303. Note that there is a comment from chfeizy that fixes the issue for Version 2.0.5, which made it a more reliable solution than 3.2.2.