メニュー 閉じる

085. p5.jsで3Dシューティングゲームのライトをもう少し変えてみる

ライトの設定とマテリアルをちょっと変えてみました。

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

var fighter;

var bullets = [];

var stars = [];

var camx = 0.0;
var camy = 0.0;

var targetx = 0.0;
var targety = 0.0;

var main_z = 0.0;

var dragged = false;

function setup () {

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

	fighter = new FighterBase ();

}

function draw () {

	background (0);

	/*
	ambientLight (180, 120, 20);
  	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, 0, 255, 2000.0, 2000.0, 0.0);
  	pointLight (0, 0, 255, -2000.0, -2000.0, 0.0);
  	*/

  	pointLight (255, 255, 0, -mouseX + width / 2.0, -mouseY + height / 2.0, main_z + 1500.0);
  	pointLight (255, 255, 0, -mouseX + width / 2.0, -mouseY + height / 2.0, main_z - 250.0);

  	targetx = -mouseX + (width / 2.0);
  	targety = -mouseY + (height / 2.0);

  	camx += (targetx - camx) * 0.1;
  	camy += (targety - camy) * 0.1;

  	camera (-1.0 * camx, camy, main_z - 250.0,
			0.0, 0.0, main_z + 1500.0,
			0.0, 1.0, 0.0);

	rotateY (PI);

	for (var i = 0 ; i < 10; i++) {
		stars.push (new StarBase (random (-width, width), random (-height, height), -10000.0, random (40.0)));
	}

	for (var i = 0; i < stars.length; i++) {
		stars[i].update ();
		stars[i].render ();
		if (stars[i].diff_z > -10000.0) {
			stars.splice (i, 1);
		}
	}

	fighter.render ();

	if (dragged == true) {
		bullets.push (new BulletBase (60.0, 0.0, 0.0, random (-40.0, -180.0), 0.0, false));
		bullets.push (new BulletBase (-60.0, 0.0, 0.0, random (-40.0, -180.0), 0.0, false));
	}

	for (var i = bullets.length - 1; i >= 0; i--) {
		bullets[i].update ();
		bullets[i].render ();
		if (bullets[i].life_flag == false) {
			bullets.splice (i, 1);
		}
	}

	main_z += 180.0;

}

function FighterBase () {

	this.update = function () {

	}

	this.render = function () {

		//stroke (0);
		//strokeWeight (0.5);

		noStroke ();
		specularMaterial (255);

		push ();
		translate (0.0, 0.0, -main_z + 0.0);
		box (80.0, 10.0, 100.0);
		pop ();

		push ();
		translate (0.0, 0.0, -main_z -60.0);
		box (40.0, 5.0, 100.0);
		pop ();

		push ();
		translate (-60.0, 0.0, -main_z);
		box (40.0, 5.0, 40.0);
		pop ();

		push ();
		translate (60.0, 0.0, -main_z);
		box (40.0, 5.0, 40.0);
		pop ();

		push ();
		translate (-60.0, 0.0, -main_z - 20.0);
		rotateX (PI / 2.0);
		cylinder (2.0, 40.0);
		pop ();

		push ();
		translate (60.0, 0.0, -main_z - 20.0);
		rotateX (PI / 2.0);
		cylinder (2.0, 40.0);
		pop ();

		push ();
		translate (-30.0, -5.0, -main_z + 50.0);
		box (4.0, 20.0, 40.0);
		pop ();

		push ();
		translate (30.0, -5.0, -main_z + 50.0);
		box (4.0, 20.0, 40.0);
		pop ();

	}

}

function mousePressed () {

	dragged = true;

}

function mouseReleased () {

	dragged = false;

}

function keyPressed () {

	dragged = true;

}

function keyReleased () {

	dragged = false;
	
}

function BulletBase (b_x, b_y, b_z, b_force, b_rad, b_flag) {

	this.location = new p5.Vector (b_x, b_y, b_z);
	this.velocity = new p5.Vector (0.0, 0.0, b_force);
	this.life_time = b_force;
	this.life_flag = true;

	this.update = function () {

		this.life_time *= 0.98;
		this.velocity.mult (0.98);
		this.location.add (this.velocity);

		if (abs (this.life_time) < 10.0) {
			this.life_flag = false;
		}

	}

	this.render = function () {

		push ();
		translate (this.location.x, this.location.y, -main_z + this.location.z);
		//stroke (0);
		//strokeWeight (0.5);
		noStroke ();
		specularMaterial (255);
		box (10);
		pop ();

	}

}

function StarBase (s_x, s_y, s_z, s_r) {

	this.init_z = s_z;

	this.posx = s_x;
	this.posy = s_y;
	this.posz = s_z;

	this.diff_z = 0.0;

	this.update = function () {

		this.posz += 180.0;

		this.diff_z = this.init_z + this.posz;

	}

	this.render = function () {

		push ();
		translate (this.posx, this.posy, -main_z + this.posz);
		noStroke ();
		specularMaterial (255);
		sphere (s_r);
		pop();

	}

}

Posted in p5.js , processing