
Description:
1. I have how many days, how many hours that i slept, and a wake up time in graph.
2. By click the mouse, you would get the time when i woke up.
2. The cloud and the emoji, represented when i haven't sleep for a day.
Visualization data
2018 / 04 / 18
VISUALIZATION DATA
​
Since my sleep schedule kinda mess, then i'm gonna represented about my sleep schedule by visualization data. Hoping that would be my motivation for sleep regularly. From the visualization that i created, it seems different because I've got a struggle how to make it good so i changed it a bit.
​
This is my drive:
https://drive.google.com/open?id=1V7Ar_d_UjVyladydP_ShAQAUJEsDTsjF
String []sleepSchedule;
int [] days;
int [] hours_slept;
int [] wake_up_times;
PImage stars;
PImage cloud;
PImage moon;
PImage sad;
PImage dizzy;
float xPos = 790;
float yPos = 100;
float xSpeed = 2;
float ySpeed = 2;
void setup() {
size(1100, 800);
sleepSchedule = loadStrings("sleep.txt");
stars = loadImage("stars.png");
cloud = loadImage("cloud.png");
moon = loadImage("moon.png");
sad = loadImage("sad.png");
dizzy = loadImage("dizzy.png");
String []temp0 = splitTokens(sleepSchedule[0], ", ");
String []temp1 = splitTokens(sleepSchedule[1], ", ");
String []temp2 = splitTokens(sleepSchedule[2], ", ");
days = int(temp0);
hours_slept =int(temp1);
wake_up_times = int(temp2);
for (int i=0; i < days.length; i++) {
println(days[i] + "days");
println(hours_slept[i] + "Hours");
println(wake_up_times[i] + " wake");
}
}
void draw() {
background(0);
imageMode(CORNER);
image(moon, 10, 20, 100, 100);
line(200, 700, 200, 100);
//line(900, 700, 900, 100);
stroke(255);
line(900, 700, 200, 700);
textSize(40);
fill(245, 183, 177);
text("1", 250, 750);
text("2", 360, 750);
text("3", 470, 750);
text("4", 580, 750);
text("5", 690, 750);
text("6", 800, 750);
textSize(20);
fill(247, 220, 111);
text("1", 150, 600);
text("2", 150, 510);
text("3", 150, 420);
text("4", 150, 330);
text("5", 150, 240);
text("6", 150, 150);
​
for ( int i=0; i< 5; i++ ) {
image(stars, 240 + i*110, 560 - hours_slept[i]*75, 40, 40);
if ( mouseX > 240 + i*110 && mouseX < 240+i*110 + 40
&& mouseY > 560 - hours_slept[i]*75 && mouseY < 560 - hours_slept[i]*75+40
&& mousePressed ) {
textSize(100);
text( wake_up_times[i], 500, 400);
image(sad, 700, 100, 60, 60);
}
}
pushMatrix();
imageMode(CORNER);
image(cloud, xPos, yPos, 60, 40);
image(dizzy, xPos, yPos, 50, 50);
textSize(40);
text("0", xPos, yPos);
xPos = xPos + xSpeed;
yPos = yPos + ySpeed;
if (xPos>500) {
xSpeed = -xSpeed;
}
if (xPos<60) {
xSpeed = -xSpeed;
}
if (yPos>60) {
ySpeed = -ySpeed;
}
if (yPos<600) {
ySpeed = -ySpeed;
}
popMatrix();
}
Thank you.