Generative Design with p5.js / Sketch P_2_2_4_01 を試しながらアレンジ。
元ネタ：https://editor.p5js.org/generative-design/sketches/P_2_2_4_01
新しく覚えたコマンドなど
Number.MAX_VALUE
// represents the maximum numeric value representable in JavaScript.
// has a value of approximately 1.79E+308ロジックのポイント
毎フレーム、円1個ずつ成長していく。
成長する箇所は必ずどこかに接するようにランダムに決定される。
ランダムな位置の決定方法
- 最初にキャンバスの中心に円を描く。
- 次に、キャンバス内のランダムな位置に円を定義する。この円は描画しない。
- この見えない円の中心と、描画済みのすべての円の中心との距離を一つ一つ調べ、一番近い円の番号と距離を見つける。
- 見えない円と一番近い円との角度を求め、同じ方向で、かつ一番近い円に接する位置に見えない円と同じ大きさの円を描画する。
出っ張った部分が一番近くなりがちなので、成長の仕方としては、新しい枝が増えるよりも、枝が伸びていくほうが優先されている感じ。
粘菌の成長みたい。
アレンジ
塗りの色をランダムにしてみた。
毎フレーム新規に描画されるので、色がチラチラとして、より生きているみたいな感じになった。
