34. 円をたくさん描く
void draw() {
background(255, 255, 255);
int x = 20;
int y = 200;
int d = 30;
for (int i = 0; i < 8; i++) {
ellipse(x + i * 40, y, d, d);
}
}
初期値
継続条件
{ }の中身の後に
毎回やる事
35. 円をたくさん描く
void draw() {
background(255, 255, 255);
int x = 20;
int y = 200;
int d = 30;
for (int i = 0; i < 8; i++) {
ellipse(x + i * 40, y, d, d);
}
}
初期値
継続条件
{ }の中身の後に
毎回やる事
x = 20, 60, 100, 140, 180,
220, 260, 300
i = 0, 1, 2, … , 6, 7
46. Processingで円を円状に配置する
void draw() {
background(255, 255, 255);
pushMatrix();
translate(width/2, height/2);
int d = 30;
int num = 8;
for (int i = 0; i < num; i++) {
int R = 150;
float x = R * cos(i * TWO_PI / num);
float y = R * sin(i * TWO_PI / num);
ellipse(x, y, d, d);
}
popMatrix();
}
47. Processingで円を円状に配置する
void draw() {
background(255, 255, 255);
pushMatrix();
translate(width/2, height/2);
int d = 30;
int num = 8;
for (int i = 0; i < num; i++) {
int R = 150;
float x = R * cos(i * TWO_PI / num);
float y = R * sin(i * TWO_PI / num);
ellipse(x, y, d, d);
}
popMatrix();
}
pushMatrix〜popMatrixの間は
(0, 0)の位置を左上から
キャンバスの中心に移動
(translate)
width : キャンバスの横の長さ
height : キャンバスの縦の長さ
48. Processingで円を円状に配置する
void draw() {
background(255, 255, 255);
pushMatrix();
translate(width/2, height/2);
int d = 30;
int num = 8;
for (int i = 0; i < num; i++) {
int R = 150;
float x = R * cos(i * TWO_PI / num);
float y = R * sin(i * TWO_PI / num);
ellipse(x, y, d, d);
}
popMatrix();
}
intが整数型だったのに対し、
floatは浮動小数点数型
TWO_PI = 2π
49. Processingで円を円状に配置する
void draw() {
background(255, 255, 255);
pushMatrix();
translate(width/2, height/2);
int d = 30;
int num = 8;
for (int i = 0; i < num; i++) {
int R = 150;
float x = R * cos(radians(i * 360 / num));
float y = R * sin(radians(i * 360 / num));
ellipse(x, y, d, d);
}
popMatrix();
}
50. Processingで円を円状に配置する
void draw() {
background(255, 255, 255);
pushMatrix();
translate(width/2, height/2);
int d = 30;
int num = 8;
for (int i = 0; i < num; i++) {
int R = 150;
float x = R * cos(radians(i * 360 / num));
float y = R * sin(radians(i * 360 / num));
ellipse(x, y, d, d);
}
popMatrix();
}
radians関数が角度を
ラジアン(弧度法)に
変換してくれる
360度→2π
62. Processingで円を円状に配置する
void draw() {
background(255, 255, 255);
pushMatrix();
translate(width/2, height/2);
int d = 10;
int num = 360;
int t = 4;
for (int i = 0; i < num; i++) {
float R = 150 * abs(sin(radians(i * t)));
float x = R * cos(radians(i * 360 / num));
float y = R * sin(radians(i * 360 / num));
ellipse(x, y, d, d);
}
popMatrix();
}
63. Processingで円を円状に配置する
void draw() {
background(255, 255, 255);
pushMatrix();
translate(width/2, height/2);
int d = 10;
int num = 360;
int t = 4;
for (int i = 0; i < num; i++) {
float R = 150 * abs(sin(radians(i * t)));
float x = R * cos(radians(i * 360 / num));
float y = R * sin(radians(i * 360 / num));
ellipse(x, y, d, d);
}
popMatrix();
}
R を0から150の間で
いったりきたり増減させている
abs関数を通すと絶対値の値が
出力されるので
マイナス部分がプラスとして
得られる
絶対値 : 0からの距離
(例 : -3と3は0から3の距離)
64. Processingで円を円状に配置する
void draw() {
background(255, 255, 255);
pushMatrix();
translate(width/2, height/2);
int d = 10;
int num = 360;
int t = 4;
for (int i = 0; i < num; i++) {
float R = 150 * abs(sin(radians(i * t)));
float x = R * cos(radians(i * 360 / num));
float y = R * sin(radians(i * 360 / num));
ellipse(x, y, d, d);
}
popMatrix();
}
1から順に数字に変えてみましょう!
66. Processingで円を円状に配置する
void draw() {
background(255, 255, 255);
pushMatrix();
translate(width/2, height/2);
int d = 10;
int num = 360;
int t = 4;
for (int i = 0; i < num; i++) {
noStroke();
if (i % 3 == 0) {
fill(0, 0, 200);
d = 10;
} else {
fill(0, 150, 200);
d = 5;
}
float R = 150 * abs(sin(radians(i * t)));
float x = R * cos(radians(i * 360 / num));
float y = R * sin(radians(i * 360 / num));
ellipse(x, y, d, d);
}
popMatrix();
}
67. Processingで円を円状に配置する
void draw() {
background(255, 255, 255);
pushMatrix();
translate(width/2, height/2);
int d = 10;
int num = 360;
int t = 4;
for (int i = 0; i < num; i++) {
noStroke();
if (i % 3 == 0) {
fill(0, 0, 200);
d = 10;
} else {
fill(0, 150, 200);
d = 5;
}
float R = 150 * abs(sin(radians(i * t)));
float x = R * cos(radians(i * 360 / num));
float y = R * sin(radians(i * 360 / num));
ellipse(x, y, d, d);
}
popMatrix();
}
もしも3で割った余りが0なら
→ 3で割り切れる数字ならば
そうでない時は...