Interactive

  1. Interactive Face

def setup():
 size(500, 500)
 stroke(204, 102, 0) #this is made with 3 rgb values
 strokeWeight(10)
 
def draw(): 
 #this is where the eyes are
 background(255, 204, 0)
 strokeWeight(10)
 ellipse(250, 250, 200, 200)
 eyeRadius = 30
 eyeYPosition = 220
 leftEyeXPosition = 200
 rightEyeXPosition = 300
 #this is where the mouth is
 mouthWidth = 80
 mouthHeight = 20
 mouthX = 210
 mouthY = 300

#Hair
 strokeWeight(5)
 line(185.72, 173.4, 198.58, 188.72)
 line(200, 163.4, 210, 180.72)
 line(215.80, 156.03, 222.64, 174.82)
 line(232.64, 151.52, 236.11, 171.22)
 line(250, 150, 250, 170)
 line(267.36, 151.52, 263.89, 171.22)
 line(284.2, 156.03, 277.36, 174.82)
 line(300, 164.4, 290, 180.72)
 line(314.28, 173.4, 301.42, 188.72) 
 #this is where we define our color variables
 mouthColorHighlight = color(0, 255, 0)
 mouthColorUnHighlighted = color(0, 0, 0)
 
 #this is where I draw the shapes of the face
 fill(255, 0, 0)
 ellipse(leftEyeXPosition, eyeYPosition, eyeRadius*0.2, eyeRadius*0.2)
 fill(0, 0, 0)
 ellipse(rightEyeXPosition, eyeYPosition, eyeRadius*0.2, eyeRadius*0.2)
 
 if 200<mouseX < 300:
 fill(mouthColorHighlight)
 rect(mouthX, mouthY, mouthWidth, mouthHeight)
 else:
 fill(mouthColorUnHighlighted)
 rect(mouthX, mouthY, mouthWidth, mouthHeight)
 
 if mousePressed: 
 fill(255, 0, 0)
 ellipse(leftEyeXPosition, eyeYPosition, eyeRadius, eyeRadius)
 fill(0, 0, 0)
 ellipse(rightEyeXPosition, eyeYPosition, eyeRadius, eyeRadius)
 rect(mouthX-40, mouthY, mouthWidth*2, mouthHeight*2)
 strokeWeight(5)
 line(185.72, 173.4, 250,100)
 line(200, 163.4, 250,100)
 line(215.80, 156.03, 250,100)
 line(232.64, 151.52, 250,100)
 line(250, 150, 250, 100)
 line(267.36, 151.52, 250,100)
 line(284.2, 156.03, 250,100)
 line(300, 164.4, 250,100)
 line(314.28, 173.4, 250,100)

2. Visualization Technique of the Earthquake Data

Like what you read? Give Yeonkyu Park a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.