p5.jsでノイズを作ってみる（２）

最近、p5.jsの勉強をリスタートさせてます。

前回は、田所淳さんの『Processing クリエイティブ・コーディング入門』パーリンノイズを作りました。

今回も、引き続き、この本のパーリンノイズの続きをやりました。
本のままですが「角度によるノイズ表現」です。

角度によるノイズ表現

function setup() {
	let canvas = createCanvas(640, 335, P2D);
	canvas.parent('canvas');

	background(255);
	stroke(1);
	
	let step = 10;
	let noiseScale = 0.01;
	for (let j = 0; j < height; j += step) {
		for (let i = 0; i < width; i += step) {
			let angle = noise(i * noiseScale, j * noiseScale) * PI * 2.0;
			push();
			translate(i, j);
			rotate(angle);
			line(-step / 2.0, 0, step / 2.0, 0);
			pop();
		}
	}
}

線（line）の角度をnoiseで出していくんですね。

本では、pushMatrix()とpopMatrix()を使っているのですが、p5.jsなのでpush()とpop()に変えています。

それ以外は、本当にそのままです。

ちなみに

今は、本を見ながら作っていますが、ある程度p5.jsを使えるようになったら、次は発想力が問われますよね。

自分にいろんなアイデアを出す能力があるのかが、不安です（笑）