P5.js Study 003

Generative Design with p5.js / Sketch P_1_1_2_01 を試しながらアレンジ。
元ネタ:https://editor.p5js.org/generative-design/sketches/P_1_1_2_01

See the Pen P_1_1_2_01 by Wagatsuma Nanao (@black_bear) on CodePen.0

マウスのX座標が彩度、Y座標が明度にそれぞれ反映されます。
1〜5のキーを押すと、円の分割数が変わります。

新たに覚えたコマンド類

beginShape(shape: const);
vertex(x1: number, y1: number);
vertex(x2: number, y2: number);
...
vertex(xn: number, yn: number);
endShape();

// shape: POINTS, LINES, TRIANGLES, TRIANGLE_FAN, TRIANGLE_STRIP, QUADS, and QUAD_STRIP
// TRIANGLE_FANの場合、最初の頂点は中心を表す
// fill()を適用した場合の挙動が不明

Leave a comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です