add panButton option

README.md

@@ -166,6 +166,18 @@ panzoom(element, {
 });
 ```
 
+## Change pan mouse button
+
+When using a mouse, the default behaviour is clicking with the left button and drag to 
+pan, you can specify which mouse button you prefer with the option `panButton`, the 
+possible options are `left` or `middle`.
+
+``` js
+panzoom(element, {
+  panButton: 'left'
+});
+```
+
 ## Zoom Speed
 
 You can adjust how fast it zooms, by passing optional `zoomSpeed` argument:

index.d.ts

@@ -51,6 +51,7 @@ declare module "panzoom" {
     enableTextSelection?: boolean;
     disableKeyboardInteraction?: boolean;
     transformOrigin?: TransformOrigin;
+    panButton?: 'left' | 'middle';
   }
 
   export interface PanZoom {

index.js

@@ -70,6 +70,7 @@ function createPanZoom(domElement, options) {
   var speed = typeof options.zoomSpeed === 'number' ? options.zoomSpeed : defaultZoomSpeed;
   var transformOrigin = parseTransformOrigin(options.transformOrigin);
   var textSelection = options.enableTextSelection ? fakeTextSelectorInterceptor : domTextSelectionInterceptor;
+  var panButton = options.panButton || 'left'; 
 
   validateBounds(bounds);
 
@@ -787,11 +788,20 @@ function createPanZoom(domElement, options) {
       e.stopPropagation();
       return false;
     }
-    // for IE, left click == 1
-    // for Firefox, left click == 0
-    var isLeftButton =
-      (e.button === 1 && window.event !== null) || e.button === 0;
-    if (!isLeftButton) return;
+
+    if (panButton === 'left') {
+      // for IE, left click == 1
+      // for Firefox, left click == 0
+      var isLeftButton =
+        (e.button === 1 && window.event !== null) || e.button === 0;
+      if (!isLeftButton) return;
+    }
+
+    if (panButton === 'middle') {
+      var isMiddleButton =
+        (e.button === 3 && window.event !== null) || e.button === 1;
+      if (!isMiddleButton) return;
+    }
 
     smoothScroll.cancel();