hammerjs / hammer.js

A javascript library for multi-touch gestures :// You can touch this
http://hammerjs.github.io
MIT License
24.09k stars 2.63k forks source link

Vertical panning and pinch not working. #1086

Open TheInvoker opened 7 years ago

TheInvoker commented 7 years ago

In my code

                     `          
        var old_zr;
        var old_yr;
        var hammertime = new Hammer(document.getElementById("sliderContainer"), {
            direction : Hammer.DIRECTION_ALL, 
            threshold : 0
        });

        hammertime.get('pinch').set({ enable: true }); 
        hammertime.on('pinch', function(ev) {
            s = ev.distance/10;
        });

        hammertime.on('panstart', function(ev) {
            old_zr = cz;
            old_yr = cy;
        });
        hammertime.on('pan', function(ev) {
            var dx = old_zr-ev.deltaX;
            var dy = old_yr+ev.deltaY;

            dx = dx % 360;
            if (dx > 180) {
                dx = -360 + dx;
            } else if (dx < -170) {
                dx = 360 + dx;
            }

            var yrR = Math.round(dy/10)*10;
            zrR = zrR == -180 ? 180 : zrR;
            zrR = zrR == 190 ? -170 : zrR;

            var zrR = Math.round(dx/10)*10;
            yrR = Math.max(0, Math.min(90, yrR))

            cz = zrR;
            cy = yrR;

            document.getElementById("val").innerHTML = zrR + "," + yrR;
        });
        `

I noticed a couple of issues. First is I can't pan vertically. I can pan horizontally though. Vertical panning only works if I first pan horizontally which is weird. In my page there is no vertical scroll bar anyways, so is there a way I can override something and make vertical panning work?

The second issue is pinch to zoom feature. It doesn't seem to work at the same time as when I enable panning. Google maps works perfectly with pinch to zoom and panning. So I know it can be done. Does anyone know what's wrong?

Thanks

angabriel commented 7 years ago

The documentation states somewhere, that Vertical Panning is not enabled per default and also gave an example to enable it. Have to say that it is hard to find and took me a whole working day...

mc.get('pan').set({direction: Hammer.DIRECTION_ALL });

squadette commented 5 years ago

@angabriel, thank you for pointing out the confusion.

I tried to better explain two different defaults in https://squadette.github.io/hammer.js/recognizer-swipe/ and https://squadette.github.io/hammer.js/recognizer-pan/