1

I'm using panzoom plugin of Timmywil https://github.com/timmywil/jquery.panzoom

in my project. It has been working fine till now. But since chrome's latest update it's broken. It zooms once but if you start panning view is reset to original position. It works with mouse wheel but pinch zoom is not working. This issue appears on chrome version 55 on android mobile. Here is the forked test fiddle link

http://jsfiddle.net/trupti11/c3umpgud/ 

var $x = $('#x'), $y = $('#y');
var svg = $('svg').on('mousemove', function(e) {
    $x.text(e.clientX);
    $y.text(e.clientY);
    })[0];
var box = svg.getBoundingClientRect();
var $panzoom = $("#viewport").panzoom({
    cursor: 'default',
    increment: 4,
    minScale: 0.5,
    maxScale: 16,
    rangeStep: 2,
    transition: true,
    duration: 200,
    easing: "ease-in-out",
    $zoomIn: $('.zoom-in'),
    $zoomOut: $('.zoom-out'),
    $zoomRange: $('.zoom-range'),
    focal: {
        clientX: 108,
        clientY: 132
    }
});

var instance = $panzoom.panzoom('instance');
instance.parentOffset = { top: 32, left: 8 };

$('#pan').on('click', function(e) {
    $panzoom.panzoom('pan', 10, 10, { relative: true, animate: true });
});

I tried updating with the latest plugin files but not change.

Can anyone shed some light?

Here is another demo page which is not working in Android Chrome version 55.

http://timmywil.github.io/jquery.panzoom/demo/

pravid
  • 719
  • 9
  • 27

1 Answers1

0

Here is the solution which worked for me. I had to update to new js file and comment line 

"this.panning = true"

at line no 1164.
Another problem because of this change was that my image view was shifted halfway down to center of page div. But I got it sorted it by specifying height for main page div.

Check below links for more details
https://github.com/timmywil/jquery.panzoom/issues/308
https://github.com/timmywil/jquery.panzoom/issues/303

pravid
  • 719
  • 9
  • 27