【p5js/プログラミング】ミキサー。

Art

こんにちは、たやち(tayati369)です。

p5.jsでコーディングしています。
PCD@Tokyoさんの「デイリーコーディングチャレンジ」!!に素人極まりない私も参加しております。
毎日できるかわからないけれど、リモートワークのこのご時世、通勤分の時間があるでチャレンジしていきます。(デイリーとはw)

32日目のテーマは「ミキサー」。

vertex()を使って、ミキサーの鋭い刃を表現しています。昨日の回るのテーマにかぶりますが、調理器具のミキサーらしく高速回転も加えてみました。果物っぽい色合いもいい感じにできていると思っています。最近やっとイメージしたものをコードに落とし込めるようになってきたので、少し長いコードも苦でなくなってきている感があります!(もちろんスキルはまだまだですが)

では、ごらんあれ〜。

const num = 50;
var mikisa = [];

function setup(){
	createCanvas(500,500);
	frameRate(30);
	colorMode(HSB,360,100,100,100);
	for (var i = 0; i < num; i++) {
		mikisa[i] = new Mikisa;
	}
	// noLoop();
}

function draw(){
	background(220,25,80,100);
	translate(width/2,height/2);
	for (var i = 0; i < mikisa.length; i++) {
		mikisa[i].show();
		mikisa[i].update();
	}
}
class Mikisa {
	constructor() {
		this.x = 0;
		this.y = 0;
		this.r = random(50,250);
		this.w = random(1,1.2);
		this.angle = 0;
		if (random(1) < 1/4) {
                        this.p = PI;
                        this.col = random(260,310);
                }else if (random(1) >= 1/4 && random(1) < 1/2) {
                        this.p = HALF_PI; this.col = random(166,220);
                }else if (random(1) >= 1/2 && random(1) < 3/4) {
			this.p = QUARTER_PI;
			this.col = random(0,17);
		}else {
			this.p = TWO_PI;
			this.col = random(18,37);
		}
		noStroke();
	}
	show(){
		fill(this.col,random(40,100),random(70,100),random(50,80));
		beginShape();
		for (var i = 0; i < this.p; i+=0.1) {
                        this.x = this.r * cos(i);
                        this.y = this.r * sin(i);
                        vertex(this.x,this.y) 
                }
                for (var j = this.p; j > 0; j-=0.1) {
			this.x = this.r/this.w * cos(j);
			this.y = this.r/this.w * sin(j);
			vertex(this.x,this.y)
		}
		endShape();
	}
	update(){
		rotate(this.angle);
		this.angle += 0.001;
	}
}

ではでは、さようなら〜〜〜。

なにかあればTwitterまで。

コメント