diff --git a/src/components/dots.js b/src/components/dots.js index d68efc8..ded89a1 100644 --- a/src/components/dots.js +++ b/src/components/dots.js @@ -1,5 +1,6 @@ // calculate tiles +const SIN_PERIOD = 100 / Math.PI; const RADIUS_OPTS = [ "const", @@ -16,6 +17,9 @@ const RADIUS_OPTS = [ "hyper-in", "hyper-out", "noise", + "diamonds", + "horizontal-bands", + "vertical-bands", ]; const RADIUS_DESC = { @@ -33,6 +37,9 @@ const RADIUS_DESC = { "hyper-in": "forming a starlike pattern at the centre", "hyper-out": "leaving a starlike pattern gap in the centre", "noise": "of random sizes", + "diamonds": "in a grid tilted at 45 degrees", + "horizontal-bands": "in horizontal bands", + "vertical-bands": "in a vertical bands", } function distance(dx, dy) { @@ -107,6 +114,12 @@ class DotMaker { return maxr * (1 - Math.abs((d.x - this.cx) * (d.y - this.cy)) / this.wh); case "noise": return maxr * Math.random(); + case "horizontal-bands": + return maxr * (1 + Math.cos(SIN_PERIOD *(d.y - this.cy)/ this.wh)); + case "vertical-bands": + return maxr * (1 + Math.cos(SIN_PERIOD *(d.x - this.cx)/ this.wh)); + case "grid": + return maxr * (0.5 + 0.5 * (Math.cos(SIN_PERIOD *(d.x - this.cx)/ this.wh) + Math.cos(SIN_PERIOD * (d.y - this.cy)/ this.wh))); default: return maxr; }