...
Code Block |
---|
void setup() { size(400,400); // def. window size strokeWeight(15); // line thickness } void draw() { background(255); // def. background colour float radius = dist(mouseX,mouseY,width/2,height/2); // calculate the distance from the mouse curser to the center of the screen radius = map(radius,0,width,1,4); // modify the radius to keep it within a specific range. pushMatrix(); translate(200,200); rotate(calcAngle()); scale(radius); smiley(); // function call popMatrix(); pushMatrix(); translate(30,30); scale(.2); smiley(); // function call popMatrix(); } // funktion void smiley() { noFill(); ellipse(0,0,180,180); // head fill(0); ellipse(0 - 30,0 - 30,20,20); // left eye ellipse(0 + 30,0 - 30,20,20); // right eye noFill(); arc(0,0,100,100,radians(20),radians(180-20)); // mouth } // calculate the angle from the screen middle to the mouse cursor // the angle is in radians float calcAngle() { return -atan2(mouseX - (width / 2),mouseY - (height / 2)); } |
Hier gibts gleich mehrere Neuigkeiten, Linie This example introduces a couple of new things starting on line 13:
float radius = dist(mouseX,mouseY,width/2,height/2);
Hier wird die Distanz vom Mauszeiger zur Fenstermitte ermittelt(Siehe Here the distance from the mouse pointer to the window center is determined (see Pythagoras).Linie 14:
radius = map(radius,0,width,1,4);
Hier eine Zahl auf einen anderen Zahlenbereich gemapt. Der Original-Bereich ist von 0-width. Der Ziel-Bereich ist von The original range is from 0 to the width of the window. The target range is from 1-4. Nun wird radius von Original-Bereich auf den Ziel-Bereich transformiert.
Aufgaben
Schreib ein Programm welches einen Smiley am Mauszeiger folgen lässt. Dazu soll ein kleineres Smiley um den grossen Smiley in einer Umlaufbahn kreisen.Now radius is transformed from original range to the target range.
Exercise
Modify the program so a small smiley orbits around he big smiley, in the direction of the mouse position.