Time Tables visualized in a circle #1036
Description
He, maybe this is an idea for a coding challenge:
visualizing timetables in a circle. I got the idea from this video:
https://www.youtube.com/watch?v=qhbuKbxJsk8&feature=youtu.be
I have attached my solution.
Hope you like it!
function setup(){
createCanvas(windowWidth,windowHeight);
angleMode(DEGREES);
// frameRate(50);
}
//set the radius of the circle
var r = 800;
//the amount of points to calculate
var tableModules = 400;
//the current table
var times = 0;
//the stepsize between the tables
var timeStep = 0.002;
function draw(){
background(255);
stroke(127,255,127);
translate(width/2,height/2);
ellipse(0,0, r2, r2);
for(var i = 0; i < tableModules; i++){
//calculate the coordinates of the first point on the circle
var x1 = -cos(360/tableModules * i) * r;
var y1 = sin(360/tableModules * i) * r;
//calculate the coordinates of the answer on the circle
var x2 = -cos(360/tableModules * (i * times)) * r;
var y2 = sin(360/tableModules *(i * times)) * r;
//draw the line
line(x1,y1,x2,y2);
}
//go to the next table
times += timeStep;
//display some info
textSize(40);
text("Tabel : " + floor(times * 1000)/1000, -r*2, 0);
text("Multiplied from 1 to : " + tableModules, -r*2, 50);
}