Mandala table
Mandalas table.
by schrodingers
HTML
<script src="https://cdnjs.cloudflare.com/ajax/libs/processing.js/1.4.15/processing.js"></script>
<canvas></canvas>
CSS
body {
overflow: hidden;
margin: 0;
padding: 0;
}
</style> <script type="text/javascript"> window.addEventListener('load', function() {
var scripts=document.body.getElementsByTagName('script');
var canvases=document.body.getElementsByTagName('canvas');
new Processing(canvases[0], scripts[0].text);
}
, false);
// Here prevent javascript in body from throwing error </script> <style>
JavaScript
void setup() {
size(800, 600);
background(220);
//noStroke();
smooth();
colorMode(HSB, 360, 100, 100);
int rows = 4;
int cols = 4;
float outerRad = width / cols;
int pointCount;
int steps;
float innerRadFac;
float innerRad;
float outerRadRat;
float innerRadRat;
float shadeRat;
float rotationRat;
translate(outerRad / 2, outerRad / 2);
for (int i = 0; i < rows; i++) {
for (int j = 0; j < cols; j++) {
pointCount = int(random(5, 17));
steps = int(random(5, 20));
innerRad = outerRad * random(.4, .9);
outerRadRat = outerRad / steps;
innerRadRat = innerRad / steps;
float randCol = random(255, 255);
shadeRat = randCol / steps;
rotationRat = random(90, 200) / steps;
pushMatrix();
translate(outerRad * j, outerRad * i);
for (int k = 0; k < steps; k++) {
fill(shadeRat * k);
stroke(randCol - shadeRat * k, 100);
pushMatrix();
scale(.45);
rotate(rotationRat * k * PI / 180);
star(pointCount, outerRad - outerRadRat * k, innerRad - innerRadRat * k);
popMatrix();
}
popMatrix();
}
}
}
void star(int pointCount, float innerRad, float outerRad) {
float theta = 0;
int vertCount = pointCount * 2;
float thetaRot = TWO_PI / vertCount;
float tempRad = 0.0;
float x = 0;
float y = 0;
beginShape();
for (int f = 0; f < pointCount; f++) {
for (int j = 0; j < 2; j++) {
tempRad = innerRad;
if (j % 2 == 0) {
tempRad = outerRad;
}
x = cos(theta) * tempRad;
y = sin(theta) * tempRad;
vertex(x, y);
theta += thetaRot;
}
}
endShape(CLOSE);
}