En resumen, una funcionalidad que necesito es que un usuario pueda acercar y alejar la imagen usando el panel táctil (solo pellizcar) y la rueda del mouse, pero si un usuario se desplaza usando el panel táctil (arriba, derecha, izquierda, abajo) en lugar de hacer zoom, necesito desplazarme similar a cuando se usa fuera del lienzo pero con el puntero en forma de cruz dentro del lienzo.

este es el codigo

 <div class="canvas-container"> <canvas id="c" width="500" height="500" style="border:1px solid #ccc"></canvas> <p>Should scroll even if cursor is in canvas</p> <p>Touch pad up down left right should scroll like a browser scroll instead of zoom in and out with crosshair cursor</p> </div> var canvas = new fabric.Canvas('c'); fabric.Image.fromURL('http://i.imgur.com/8rmMZI3.jpg', function(oImg) { oImg.selectable = false; oImg.id = 'image'; canvas.add(oImg); }); canvas.on('mouse:wheel', function(opt) { if (opt.e.ctrlKey) { // pinching behavior to zoom in and out var delta = opt.e.deltaY; var pointer = canvas.getPointer(opt.e); var zoom = canvas.getZoom(); zoom = zoom + delta/200; if (zoom > 20) zoom = 20; if (zoom < 0.01) zoom = 0.01; canvas.zoomToPoint({ x: opt.e.offsetX, y: opt.e.offsetY }, zoom); } opt.e.preventDefault(); opt.e.stopPropagation(); });

Para fines de demostración, obtuve esto de algunos SO https://jsfiddle.net/r6mkb9wg/

Probé con eventos de puntero que funcionan, pero no puedo usar el cursor en forma de cruz y tampoco funciona pellizcar.