Camera: Zoom

src/Drawable.js

@@ -215,6 +215,11 @@ class Drawable {
                 this._position[0] = Math.round(position[0]);
                 this._position[1] = Math.round(position[1]);
             }
+
+            const cameraState = this._renderer.cameraState;
+            this._position[0] /= cameraState.zoom;
+            this._position[1] /= cameraState.zoom;
+
             this._renderer.dirty = true;
             this.setTransformDirty();
         }

src/RenderWebGL.js

@@ -201,7 +201,7 @@
             cos: 1,
             zoom: 1,
             width: 240,
             height: 180,
         };
 
         /**
@@ -497,7 +497,7 @@
         this._updateProjection();
     }
 
     _updateProjection() {
         const sin = this.cameraState.sin;
         const cos = this.cameraState.cos;
         const width = this.cameraState.width;
@@ -519,8 +519,8 @@
             0,
             -1,
             0,
             (cos * -x + sin * -y) / width,
             (cos * -y - sin * -x) / height,
             0,
             1,
         ];
@@ -1559,14 +1559,14 @@
 
         this._doExitDrawRegion();
 
-        const nativeCenterX = this._nativeSize[0] * 0.5;
-        const nativeCenterY = this._nativeSize[1] * 0.5;
+        const nativeCenterX = (this._nativeSize[0] / this.cameraState.zoom) * 0.5;
+        const nativeCenterY = (this._nativeSize[1] / this.cameraState.zoom) * 0.5;
 
         const scratchBounds = drawable.getFastBounds();
 
         const canvas = this.canvas;
         // Ratio of the screen-space scale of the stage's canvas to the "native size" of the stage
-        const scaleFactor = canvas.width / this._nativeSize[0];
+        const scaleFactor = (canvas.width / this._nativeSize[0]) * this.cameraState.zoom;
 
         // Bounds of the extracted drawable, in "canvas pixel space"
         // (origin is 0, 0, destination is the canvas width, height).