JSFiddle - React, Tailwind, and code Playground
by Darby Rathbone
JavaScript
var Vector = (function () {
function Vector(x, y) {
this.x = x;
this.y = y;
this.prevmag = 1;
}
return Vector;
})();
Vector.prototype = {
toString: function () {
return "[" + this.x + "," + this.y + "]";
},
mag: function () {
return Math.sqrt((this.x * this.x) + (this.y * this.y));
},
mult: function (k) {
this.x = this.x * k;
this.y = this.y * k;
return this.toString();
},
div: function (k) {
this.x = (this.x) / (k);
this.y = (this.y) / (k);
return this.toString();
},
norm: function () {
this.prevmag = this.mag();
this.div((this.mag()));
return this.toString();
},
add: function (vk) {
this.x = this.x + vk.x;
this.y = this.y + vk.y;
return this.toString();
},
sub: function (vk) {
this.x = this.x - vk.x;
this.y = this.y - vk.y;
return this.toString();
},
direction: function () {
return Math.atan2(this.y, this.x);
},
dot: function (v1) {
return (v1.x * this.x) + (v1.y * this.y);
},
distance: function (other) {
return ((this.x - other.x) * (this.x - other.x) + (this.y - other.y) * (this.y - other.y));
}
};
var canvas = document.createElement("canvas");
canvas.width = 200;
canvas.height = 200.0*Math.sqrt(3)/2.0;
var ctx = canvas.getContext("2d");
var pixels = ctx.getImageData(0,0,parseFloat(canvas.width),parseFloat(canvas.height)).data;
document.body.appendChild(canvas);
function makeGrid(c, w) {
var height = canvas.height/w;
var width = canvas.width/w;
var rows = [];
var count = 0;
for (var j = 0; j <= w; j += 1) {
rows.push([]);
for (var i = 0; i <= w; i += 1) {
rows[j].push(new Vector((i * width+(width*j/2.0))%c.width , (j * height)%c.height));
count++;
}
}
for (var i = 0, ar = []; i < count; i++) {
ar[i]...