Sphere fragmented
Processing.js
by schrodingers
HTML
<canvas></canvas>
CSS
</style> <script type="text/javascript"> window.addEventListener('load', function() {
var scripts=document.body.getElementsByTagName('script');
var canvases=document.body.getElementsByTagName('canvas');
new Processing(canvases[0], scripts[0].text);
}
, false);
// Here prevent javascript in body from throwing error </script> <style>
JavaScript
/*
title: Sphere sliced
date: 2015-12-09
*/
color[] spring = {#ff6699, #ff9900, #ffcc00, #9adb1b, #00cc66, #00cccc, #00ccff, #6633cc, #ff66cc
};
int num = 3;
float radius = 100;
color col;
Circle[] circles = new Circle[3];
void setup() {
size(800, 600, P3D);
col = (int)random(spring[spring.length-1]);
circles[0] = new Circle(col, 84, PI/3);
circles[1] = new Circle(col, 92, -PI/3);
circles[2] = new Circle();
}
void draw() {
background(33);
translate(width/2, height/2);
slicedSphere();
}
class Circle {
int col;
int size; // radius
float angle; // angle of rotation
Circle() {
size = 100;
angle = 0;
col = spring[(int)random(spring.length-1)];
}
Circle(int _col, int _size, float _angle) {
col = _col;
size = _size;
angle = _angle;
}
}
void slicedSphere() {
rotateX(frameCount * 0.01);
rotateY(frameCount * 0.02);
float s = 0;
float t = 0;
float lastX = 0;
float lastY = 0;
float lastZ = 0;
while (t < 180) {
s += 25;
t += 1;
float x = 0 + (radius * cos(radians(s)) * sin(radians(t)));
float y = 0 + (radius * sin(radians(s)) * sin(radians(t)));
float z = 0 + (radius * cos(radians(t)));
strokeWeight(3);
stroke(col);
beginShape();
if (lastX != 0) {
line(x, y, z, lastX, lastY, lastZ);
}
endShape();
lastX = x;
lastY = y;
lastZ = z;
}
}
void mousePressed() {
if (mouseButton == LEFT) {
noLoop();
}
if (mouseButton == RIGHT) {
loop();
}
}
// Utilities functions
void keyPressed() {
if (key=='r' || key == 'R') {
setup();
}
if (key == 's' || key == 'S') {
saveFrame("out/pic-##.png");
println("Picture saved as " + "pic-"+ frameCount +".png");
}
}