メニュー 閉じる

092. p5.jsで027のサウンドイコライザーを3D変換してみる

クリックする度にランダムなドラム音が追加されて、イコライザーに反映されます。
20音くらいでリセット。視点はマウスで反応してます。

http://www.velvet-number.com/p5_test/test062/

var sound = ['x', '*', 'o', '-'];

var targetx;
var targety;

var rotx = 0.0;
var roty = 0.0;

var drum;
var drum_string;
var fft_size = 256;

var count = 1;

function setup () {

	pixelDensity (displayDensity ());
	createCanvas (windowWidth, windowHeight, WEBGL);

	drum_string = 'x';

	drum = EDrums (drum_string);

	bass = Mono ('bass').note.seq ([0, 7], 1 / count);
	bass.amp (0.2);

	Gibber.scale.root.seq (['c4','eb4', 'g4', 'c4'], 1);

	fft = FFT (fft_size);

}

function draw() {

	background (0);

	background (0, 0, 0);

	ambientLight (10, 10, 120);
  	pointLight (255, 0, 0, 2000.0, 0.0, 2000.0);
  	pointLight (255, 0, 0, -2000.0, 0.0, -2000.0);
  	pointLight (0, 255, 0, 0.0, 2000.0, 2000.0);
  	pointLight (0, 255, 0, 0.0, -2000.0, -2000.0);
  	pointLight (255, 0, 0, 2000.0, 0.0, 2000.0);
  	pointLight (255, 0, 0, -2000.0, 0.0, -2000.0);
  	pointLight (0, 255, 0, 0.0, 2000.0, 2000.0);
  	pointLight (0, 255, 0, 0.0, -2000.0, -2000.0);

  	camera (0.0, 0.0, -1000.0,
			0.0, 0.0, 0.0,
			0.0, 1.0, 0.0);

  	targetx = mouseX;
  	targety = mouseY;

  	rotx += (targetx - rotx) * 0.1;
  	roty += (targety - roty) * 0.1;

  	rotateY (rotx * 0.01);
  	rotateX (roty * 0.01);
  
	var num_bars = fft_size / 1;
	var bar_width = width / num_bars;
	var bar_color = null;
	var value = null;
    
	for (var i = 0; i < num_bars; i++ ) {
		bar_color = color (255, 255, (i / num_bars) * 255);
		stroke (0);
		fill (bar_color);
		rectMode (CENTER);
		value = (fft[i] / 255) * width;
		rect (bar_width * i, height, bar_width, -value / 0.1);
	}

}

function mousePressed () {

	count += 1;

	if (count > 20) {
		count = 0;
		drum_string = "";
	}

	bass.kill ();
	drum.kill ();
	var num = int(random (5));
	drum_string += sound[num];
	drum = EDrums (drum_string);

	bass.kill ();
	bass = Mono ('bass').note.seq ([0, 8], 1 / count);
	bass.amp (0.2);
	
}

Posted in p5.js , processing