51/2203 3D with Directional Lighting

var amountt = 50;

var BOX = [];

var sx = 0;

var sy = 0;

var sz = 0;

​

function setup() {

  createCanvas(windowWidth, windowHeight, WEBGL);

  randomizee();

}

​

function draw() {

  background(100);

  directionalLight(255, 0, 0, sin(sx), sin(sy), sin(sz)); // color rgb then direction xyz

  directionalLight(0, 255, 0, cos(sx), sin(sz), cos(sy)); // color rgb then direction xyz

  directionalLight(0, 0, 255, cos(sy), sin(sx), sin(sz)); // color rgb then direction xyz

  fill(255, 255, 255, mouseX/width*255);

  for(let i=0; i<BOX.length; i++)

  {

    push();

    translate(BOX[i].x, BOX[i].y, BOX[i].z);

    rotateX(BOX[i].rx);

    rotateY(BOX[i].ry);

    rotateZ(BOX[i].rz);

    box(50);

    BOX[i].rx+=0.01;

    BOX[i].ry+=0.01;

    BOX[i].rz+=0.01;

    pop();

  }

  sx+=0.01033;

  sy+=0.0234;

  sz+=0.03024;

}

​

function keyPressed()

{

  randomizee();

}

​

function randomizee() {

  BOX = [];

  for(let i=0; i<amountt; i++)

  {

    let b = {};

    b.x = random(-width/2, width/2);

    b.y = random(-height/2, height/2);

    b.z = random(-height/2, height/2);

    b.rx = random(100);

    b.ry = random(100);

    b.rz = random(100);

    BOX.push(b);

  }

}