fix problem with asymmetric viewport margins

src/webgldrawer.js

@@ -255,9 +255,10 @@
         */
         draw(tiledImages){
             let gl = this._gl;
+            const bounds = this.viewport.getBoundsNoRotateWithMargins(true);
             let view = {
-                bounds: this.viewport.getBoundsNoRotateWithMargins(true),
-                center: this.viewport.getCenter(true),
+                bounds: bounds,
+                center: new OpenSeadragon.Point(bounds.x + bounds.width / 2, bounds.y + bounds.height / 2),
                 rotation: this.viewport.getRotation(true) * Math.PI / 180
             };
 

test/demo/drawercomparison.js

@@ -19,10 +19,10 @@ const drawers = {
 }
 
 const viewportMargins = {
-    left: 25,
-    top: 25,
-    right: 25,
-    bottom: 25,
+    left: 100,
+    top: 0,
+    right: 0,
+    bottom: 50,
 };
 
 //Support drawer type from the url