メニュー 閉じる

020. p5.jsで球の表面に針を刺していろいろと動かしてみる

球面上に細かな線を描いてマウスの位置で伸びたり縮んだりします。球の大きさも変わります。

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

var num = 1600;

var x01 = [];
var y01 = [];
var z01 = [];
var x02 = [];
var y02 = [];
var z02 = [];
var deg01 = [];
var deg02 = [];
var rot_x;
var rot_y;
var rot_z;
var amp01;
var amp02;
var range;

function setup () {

	amp01 = 200.0;

	rot_x = 0.0;
	rot_y = 0.0;
	rot_z = 0.0;

	range = 4.0;

	pixelDensity (displayDensity ());
	createCanvas (windowWidth, windowHeight, WEBGL);
	colorMode (RGB, 256);
	background (0);

	for (var i = 0; i < num; i++) {

		deg01[i] = random (360);
		deg02[i] = random (360);

	}

	for (var i = 0; i < num; i++) {

		x01[i] = amp01 * cos (radians (deg01[i])) * sin (radians (deg02[i]));
		y01[i] = amp01 * sin (radians (deg01[i]));
		z01[i] = amp01 * cos (radians (deg01[i])) * cos (radians (deg02[i]));

	}

}

function draw () {

	background (0);

	camera (mouseX - (width / 2), mouseY - (height / 2), 0.0,
			width / 2, height / 2, 0.0,
			0.0, 1.0, 0.0);

	translate (width / 2, height / 2);
	rotateX (radians (rot_x));
	rotateY (radians (rot_y));
	rotateZ (radians (rot_z));

	for (var i = 0; i < num; i++) {

		var offsetx = mouseX - (width / 2);
		var offsety = mouseY - (height / 2);

		var diffx = abs (offsetx - x01[i]);
		var diffy = abs (offsety - y01[i]);

		amp02 = (4000 / (((diffx + diffy + 1) * (diffx + diffy + 1)) * 0.001)) + amp01;

		x02[i] = amp02 * cos (radians (deg01[i])) * sin (radians (deg02[i]));
		y02[i] = amp02 * sin (radians (deg01[i]));
		z02[i] = amp02 * cos (radians (deg01[i])) * cos (radians (deg02[i]));

		stroke (int (abs (x01[i])), int (abs (y01[i])), int (abs (z01[i])));
		strokeWeight (1);
		noFill ();
		line (x01[i], y01[i], z01[i], x02[i], y02[i], z02[i]);

	}

	rot_x += map (mouseY, 0, height, -range, range);
	rot_y += map (mouseX, 0, width, -range, range);
	rot_z += ((map (mouseY, 0, height, -range, range) + map (mouseX, 0, width, -range, range)) / 2);

}

 

 

Posted in p5.js , processing