diff --git a/src/components/dots.js b/src/components/dots.js
index fc17a9a..6966370 100644
--- a/src/components/dots.js
+++ b/src/components/dots.js
@@ -44,11 +44,13 @@ function int_range(v1, v2) {
 }
 
 class DotMaker {
-	constructor(width) {
-		console.log(width);
+	constructor(width, height) {
+		console.log(width, height);
 		this.width = width;
+		this.height = height;
+		this.wh = 0.5 * (width + height);
 		this.cx = 0.5 * width;
-		this.cy = 0.5 * width;
+		this.cy = 0.5 * height;
 	}
 
 	dots(m, n, clip) {
@@ -56,13 +58,13 @@ class DotMaker {
 			return [];
 		}
 		const ps = [];
-		const is = int_range(-this.width, this.width / m)
+		const is = int_range(-this.width, this.height / m)
 		is.map((i) => {
 			const js = int_range(m * i + (m - n) * this.width, m * i)
 			js.map((j) => {
 				const x = (j - m * i) / (m - n);
 				const y = m * (x + i);
-				if( !clip || (x > 0 && y > 0 && x < this.width && y < this.width) ) {
+				if( !clip || (x > 0 && y > 0 && x < this.width && y < this.height) ) {
 					ps.push({i:i, j:j, x:x, y:y});
 				}
 			});
@@ -79,21 +81,21 @@ class DotMaker {
 	    	case "left":
 	      		return maxr * (this.width - d.x) / this.width;
 	    	case "down":
-	      		return maxr * d.y / this.width;
+	      		return maxr * d.y / this.height;
 	    	case "up":
-	      		return maxr * (this.width - d.y) / this.width;
+	      		return maxr * (this.height - d.y) / this.height;
 	      	case "right-up":
-	      		return 0.5 * maxr * (d.x + this.width - d.y) / this.width;
+	      		return 0.5 * maxr * (d.x + this.height - d.y) / this.wh;
 	      	case "left-up":
-	      		return 0.5 * maxr * (this.width - d.x + this.width - d.y) / this.width;
+	      		return 0.5 * maxr * (this.width - d.x + this.height - d.y) / this.wh;
 	      	case "right-down":
-	      		return 0.5 * maxr * (d.x + d.y) / this.width;
+	      		return 0.5 * maxr * (d.x + d.y) / this.wh;
 	      	case "left-down":
-	      		return 0.5 * maxr * (this.width - d.x + d.y) / this.width;
+	      		return 0.5 * maxr * (this.width - d.x + d.y) / this.wh;
 	      	case "out":
-	      		return 2 * maxr * distance((d.x - this.cx), (d.y - this.cy)) / this.width;
+	      		return 2 * maxr * distance((d.x - this.cx), (d.y - this.cy)) / this.wh;
 	      	case "in":
-	      		return 2 * maxr * (0.5 * this.width - distance((d.x - this.cx), (d.y - this.cy))) / this.width;
+	      		return 2 * maxr * (0.5 * this.wh - distance((d.x - this.cx), (d.y - this.cy))) / this.wh;
 
 	      	// case "hyper-out":
 	      	// 	return 2 * maxr * Math.abs(d.x - this.cx) (d.y - this.cy)) / this.width;