木曜日, 5月 01, 2008

golden rectangle



Balance in Design
読みながらprocessingで黄金長方形のコーディング。作図法を参照しながら、コードは自分で考えるというのがちょうどいい。

スクリーンのサイズ、背景色、塗りなどを設定。

size(400, 250);
background(255);
smooth();
noFill();

正方形を描く。

int square = 200;
rect(0, 0, square, square);

一辺の中点aから相対する角bまで斜線を引く。

float[] a = {square/2, square};
float[] b = {square, 0};
line(a[0], b[0], a[1], b[1]);

斜線abを半径とする弧を描く。
abの長さは三平方の定理で求められる。
dist(a[0], a[1], b[0], b[1])でも同じだけど、数学的な考え方を確認。
傾きはatan2(y, x)で求められる。

float ab = sqrt(pow(b[0] - a[0], 2) + pow(b[1] - a[1], 2));
arc(a[0], a[1], ab*2, ab*2, atan2(b[1] - a[1], b[0] - a[0]), 0);

正方形の伸ばした線と弧が交わる点をもつ小さな長方形。

rect(b[0], b[1], ab-a[0], square);

この小さな長方形と正方形で黄金長方形。
整理してまとめておく。

int square = 200;
float[] a = {square/2, square};
float[] b = {square, 0};
float ab = sqrt(pow(b[0] - a[0], 2) + pow(b[1] - a[1], 2));

size(400, 250);
background(255);
smooth();
noFill();

rect(0, 0, square, square);
line(a[0], b[0], a[1], b[1]);
arc(a[0], a[1], ab*2, ab*2, atan2(b[1] - a[1], b[0] - a[0]), 0);
rect(b[0], b[1], ab-a[0], square);

0 件のコメント: