Jacky Tian Project 06

``````//Yinjie Tian
//Section D
//yinjiet@andrew.cmu.edu
//Assignment 06

var x = [];
var y = [];
var dx = [];
var dy = [];
var color = [];

function setup() {
createCanvas(480, 480);
angleMode(DEGREES);
for (i = 0; i < 100; i++) {
x[i] = random(width);
y[i] = random(height);
dx[i] = random(-5, 5);
dy[i] = random(-5, 5);
color[i] = color(random(255), random(255), random(255));

}
frameRate(5);
}

function draw() {

background(0);

//stars at the background
noStroke();
for (i = 0; i < 100; i++) {  // for each stars at the back ...
fill(color[i]);
ellipse(x[i], y[i], 10, 10);
x[i] += dx[i];
y[i] += dy[i];

if (x[i] > width) x[i] = 0;        //horizontally
else if (x[i] < 0) x[i] = width;
if (y[i] > height) y[i] = 0;       //vertically
else if (y[i] < 0) y[i] = height;
}

var h = hour();
var m = minute();
var s = second();
var ring = random(1, 50);

//planets (clock)
push();
noStroke();

translate(width/2,height/2);
rotate(s * (360/60));

fill(0, 200, s * 5);
ellipse(200, 0, 80+ring, 80+ring);
fill(0);
ellipse(200, 0, 80, 80);
fill(200, 200, s * 5);
ellipse(200, 0, 60, 60);

line()

pop();

push();
noStroke();
fill(200, m * 5, 200);
translate(width/2,height/2);
rotate(m*(360/60));

ellipse(60, 0, 40, 40);
pop();

push();
noStroke();
fill(h * 25, 200, 200);
translate(width/2,height/2);
rotate(h*(360/12));

ellipse(100, 0, 20, 20);
pop();

//center rotational axis
strokeWeight(4);
stroke(255)
line(width / 2 - 25, height / 2, width / 2 + 25, height / 2);
line(width / 2, height / 2 - 25, width / 2, height / 2 + 25);
fill(255, 0, 0);
ellipse(width/2, height/2, 10, 10);

}``````

I was inspired by how the solar system operates like a clock that all the planets are rotating around the sun. For the clock I created, I drew three planets rotating around the center point where the nearest one represents hour, the medium one represents minute and the furtherest one tells the second.