+- Sinisterly (https://sinister.li)
+-- Forum: Coding (https://sinister.li/Forum-Coding)
+--- Forum: Coding (https://sinister.li/Forum-Coding--71)
+--- Thread: Visualizing and animating Superellipses with Processing (/Thread-Visualizing-and-animating-Superellipses-with-Processing)
Visualizing and animating Superellipses with Processing - Inori - 08-06-2016
Superellipses are a cool mathematical concept that can be visually adapted with some pretty cool results. I was messing around with the formula and some loops in p5js / Processing 3, and came up with a cool end result that I can't record because my laptop sucks. If you have the time, I recommend getting p5 running in your browser and checking this out (if you do, the canvas is 400 x 400).
Source:
Code:
translate(200,200);
stroke(255);
var r=150,
n=0.4,
s=1,
c=1;
function drawSE(){
rotate(c*(HALF_PI));
for(var theta = 0;theta < PI;theta += 0.05){
var x = pow(abs(cos(theta)), 2 / n) * r * Math.sign(cos(theta)),
y = pow(abs(sin(theta)), 2 / n) * r * Math.sign(sin(theta));
point(x,-y);
point(-x,y);
}
}
var draw=function(){
fill(51, 51, 51, 70);
rect(-201, -201, 401, 401);
drawSE();
n += 0.025 * s;
if(n<0.15){
s = -s;
n=0.15;
}else if(n > 2){
if(c>180){c=1;}
s = -s;
n=2;
}
c++;
};