Processing雁群實驗

摘要： 本文利用Processing完成一個3D隨機渲染案例。由於最終動畫效果像大雁群徘徊飛舞，我為其取名“雁群實驗”。 為了簡化說明，我們先用一個正方體旋轉做說明，程式碼如下： TIM截圖20181011151543.jpg float angle...

本文利用Processing完成一個3D隨機渲染案例。由於最終動畫效果像大雁群徘徊飛舞，我為其取名“雁群實驗”。

為了簡化說明，我們先用一個正方體旋轉做說明，程式碼如下：

float angle=0;
void setup() {
size(500, 500, P3D);
smooth();
}
void draw() {
background(100);
translate(width/2, height/2, 0);
rotateY(angle/6);
rotateX(angle/6);
angle+=0.05;
noFill(); 
box(200, 200, 200);
}

效果如下：

在上面案例中正方體的框架作為座標範圍，填充圓形（就是我們“大雁”），最終程式碼如下：

float angle=0;
void setup() {
size(500, 500, P3D);
smooth();
}
void draw() {
background(100);
translate(width/2, height/2, 0);
rotateY(angle/6);
rotateX(angle/6);
angle+=0.05;
noFill(); 
box(200, 200, 200);
translate(0, 0, -100);
for (int i=0; i<=1000; i++) {
drawCircle(10, random(-100, 100), random(-100, 100));
}
}
void drawCircle(int r, float x, float y) {
translate(0, 0, 0.2);//此處注意 0.2*上文迴圈的1000=Z軸上邊長200
fill(random(255));
ellipse(x, y, r, r);
}

效果如下：

此處應該注意一個問題：上文程式碼 translate(0, 0, 0.2)注意 0.2*上文迴圈的1000=Z軸上邊長200。如果直接用 translate(0, 0, random(200))則會出差錯，因為迴圈中的translate效果是疊加的。或者換種方式，在迴圈的末尾迴歸原來的座標系，程式碼如下：

void myLine() {
float aa=random(200);
translate(0,0,aa);
stroke(random(255));
line(random(-100,100),random(-100,100),random(-100,100),random(-100,100));
translate(0,0,-aa); //此處迴歸原來的座標系
}

註釋掉輔助邊框，效果如下：

換個顏色，效果如下：

“大雁”換成直線試試：

float angle=0;
void setup() {
size(500, 500, P3D);
}
void draw() {
background(100);
translate(width/2, height/2, 0);
rotateX(angle/4);
rotateZ(angle/4);
rotateY(angle/4);
angle+=0.1;
noFill();
stroke(0);
box(200);
translate(0,0,-100);
for(int i=0;i<1000;i++){
myLine();
}
}
void myLine() {
translate(0,0,0.2);
stroke(random(255));
line(random(-100,100),random(-100,100),random(-100,100),random(-100,100));
}

擴充套件：

在drawCircle()或者myLine()加入如下程式碼試試效果。

rotateX(random(PI));
rotateY(random(PI));
rotateZ(random(PI));