diff --git a/src/js/common.js b/src/js/common.js
index 2511fe2..75f1d8a 100644
--- a/src/js/common.js
+++ b/src/js/common.js
@@ -10,6 +10,9 @@ export class Vec2 {
         this.x = x;
         this.y = y;
     }
+    from(scalar) {
+        return new Vec2(scalar, scalar);
+    }
     static ZERO() {
         return new Vec2(0, 0);
     }
@@ -99,6 +102,9 @@ export class Vec3 {
         this.y = y;
         this.z = z;
     }
+    from(scalar) {
+        return new Vec3(scalar, scalar, scalar);
+    }
     addScalar(scalar) {
         this.x += scalar;
         this.y += scalar;
@@ -199,6 +205,9 @@ export class Vec4 {
         this.z = z;
         this.w = w;
     }
+    from(scalar) {
+        return new Vec4(scalar, scalar, scalar, scalar);
+    }
     static ZERO() {
         return new Vec4(0, 0, 0, 0);
     }
diff --git a/src/js/common.ts b/src/js/common.ts
index a776612..dcfd012 100644
--- a/src/js/common.ts
+++ b/src/js/common.ts
@@ -9,6 +9,8 @@ export function initializeContext(canvasId: string): WebGL2RenderingContext | nu
 interface Vector<P, T, N> {
     copy(): T;
 
+    from(scalar: number): T;
+
     add(other: T): void;
     addNew(other: T): T;
 
@@ -26,6 +28,7 @@ interface Vector<P, T, N> {
 
     reduce(): P;
     extend(value: number): N;
+
 }
 
 export class Vec2 implements Vector<void, Vec2, Vec3> {
@@ -37,6 +40,10 @@ export class Vec2 implements Vector<void, Vec2, Vec3> {
         this.y = y;
     }
 
+    from(scalar: number): Vec2 {
+        return new Vec2(scalar, scalar);
+    }
+
     static ZERO(): Vec2 {
         return new Vec2(0, 0);
     }
@@ -156,6 +163,10 @@ export class Vec3 implements Vector<Vec2, Vec3, Vec4> {
         this.z = z;
     }
 
+    from(scalar: number): Vec3 {
+        return new Vec3(scalar, scalar, scalar);
+    }
+
     addScalar(scalar: number): void {
         this.x += scalar;
         this.y += scalar;
@@ -288,6 +299,10 @@ export class Vec4 implements Vector<Vec3, Vec4, void> {
         this.w = w;
     }
 
+    from(scalar: number): Vec4 {
+        return new Vec4(scalar, scalar, scalar, scalar);
+    }
+
     static ZERO(): Vec4 {
         return new Vec4(0, 0, 0, 0);
     }
diff --git a/src/js/draw.js b/src/js/draw.js
index de302b3..be8a00f 100644
--- a/src/js/draw.js
+++ b/src/js/draw.js
@@ -136,6 +136,9 @@ export function drawIsometricGrid(gfx, camera, grid) {
         DrawTag.ISO,
     ]);
     let mt = Mat4.translate(camera.position.multScalarNew(-1.0));
+    let ms = Mat4.scale(new Vec3(1 / camera.scale, 1 / camera.scale, 0));
+    let mc = Mat4.translate(new Vec3((gfx.ctx.canvas.width / 2 - camera.position.x), (gfx.ctx.canvas.height / 2 - camera.position.y), 1.0));
+    let mr = Mat4.translate(new Vec3(-(gfx.ctx.canvas.width / 2 - camera.position.x), -(gfx.ctx.canvas.height / 2 - camera.position.y), 1.0));
     let mi = Mat4.isometric();
     let bias = 4 * grid.tileSize;
     let bb = [
@@ -146,6 +149,9 @@ export function drawIsometricGrid(gfx, camera, grid) {
     ];
     for (let i = 0; i < bb.length; ++i) {
         bb[i] = mt.transformNew(bb[i].extend(1.0)).reduce();
+        bb[i] = mr.transformNew(bb[i].extend(1.0)).reduce();
+        bb[i] = ms.transformNew(bb[i].extend(1.0)).reduce();
+        bb[i] = mc.transformNew(bb[i].extend(1.0)).reduce();
     }
     for (let k = 0; k < grid.topHeight; ++k) {
         for (let j = 0; j < grid.breadth; ++j) {
diff --git a/src/js/draw.ts b/src/js/draw.ts
index 80ab109..440c4eb 100644
--- a/src/js/draw.ts
+++ b/src/js/draw.ts
@@ -172,6 +172,18 @@ export function drawIsometricGrid(gfx: Graphics, camera: Camera, grid: Grid) {
     ]);
 
     let mt = Mat4.translate(camera.position.multScalarNew(-1.0));
+    let ms = Mat4.scale(new Vec3(1 / camera.scale, 1 /camera.scale, 0));
+    let mc = Mat4.translate(
+        new Vec3(
+            (gfx.ctx.canvas.width / 2  - camera.position.x),
+            (gfx.ctx.canvas.height / 2 - camera.position.y),
+            1.0));
+
+    let mr = Mat4.translate(
+        new Vec3(
+            -(gfx.ctx.canvas.width / 2  - camera.position.x),
+            -(gfx.ctx.canvas.height / 2 - camera.position.y),
+            1.0));
     let mi = Mat4.isometric();
 
     let bias = 4*grid.tileSize;
@@ -185,6 +197,9 @@ export function drawIsometricGrid(gfx: Graphics, camera: Camera, grid: Grid) {
 
     for (let i = 0; i < bb.length; ++i) {
         bb[i] = mt.transformNew(bb[i].extend(1.0)).reduce();
+        bb[i] = mr.transformNew(bb[i].extend(1.0)).reduce();
+        bb[i] = ms.transformNew(bb[i].extend(1.0)).reduce();
+        bb[i] = mc.transformNew(bb[i].extend(1.0)).reduce();
     }
 
     for (let k = 0; k < grid.topHeight; ++k) {