![見出し画像](https://assets.st-note.com/production/uploads/images/12515241/rectangle_large_type_2_aa495ee031eecd19a586e40ab7f52d71.png?width=1200)
とりあえず100 #2
int n, rad_fac, theta_fac1, theta_fac2;
float rad = width*2;
float ang = 0f;
void setup() {
size(800, 800);
smooth();
colorMode(HSB, 300, 300, 300);
noStroke();
background(0);
setValues();
}
void setValues() {
n = int(random(150, 200));
rad_fac = int(random(3, 7));
theta_fac1 = int(random(20));
theta_fac2 = int(random(20));
}
void draw() {
ang += .035f;
//残像を残す
fill(0, 0, 0, 80);
rect(0, 0, width, height);
for (int i=0; i<n; i++) {
pushMatrix();
translate(width/2, height/2);
float x1 = rad * sin(TWO_PI/n*i);
float y1 = rad * cos(TWO_PI/n*i);
translate(x1, y1);
float x2 = rad/rad_fac * sin(TWO_PI/n*i * theta_fac1 + ang);
float y2 = rad/rad_fac * cos(TWO_PI/n*i * theta_fac2 + ang);
float col = map(i, 0, n, 0, 300);
float esize = width/n*2;
fill(col, 200, 260, 260);
ellipse(x2, y2, esize, esize);
popMatrix();
}
}
void mousePressed() {
setValues();
redraw();
}
昔、はじめてvoid draw()を使ってスケッチを描いた時のものです。
<基本的な仕組み>
float x1 = rad * sin(TWO_PI/n*i);
float y1 = rad * cos(TWO_PI/n*i);
translate(x1, y1);
▲これでまず円状に座標(x1, y1)を計算し、それぞれの座標にtranslateします。
float x2 = rad/rad_fac * sin(TWO_PI/n*i * theta_fac1 + ang);
float y2 = rad/rad_fac * cos(TWO_PI/n*i * theta_fac2 + ang);
▲各座標(x1, y1)を中心としたところからさらにx2, y2を計算します。~~~~facという変数はランダム値です。多分factorの意味だと思います・・・。
毎フレームangを足しているので、アニメーションします。