Platzieren Sie einen schwarzen Punkt beliebiger Größe auf der weißen Zeichenfläche.
obligatorisch
Platzieren Sie den Punkt in der Mitte der Zeichenfläche. Hier helfen die p5 Umgebungsvariabeln width und height.
obligatorisch
Positionieren Sie den Punkt auf der X-Achse entsprechend der Mausposition. Hierfür brauchen wir das p5 MouseEvent mouseX.
obligatorisch
Positionieren Sie den Punkt auf der X-Achse entsprechend der Mausposition, allerdings soll sich der Punkt nicht über den Rand der Zeichenfläche hinaus bewegen. Ok, hier muss ein bisschen gerechnet werden. Hier könnte auch die constrain-Funktion helfen.
obligatorisch
Bislang hatte der Punkt eine absolute Größe. Jetzt soll sich die Größe des Punktes auf die Zeichenfläche beziehen, d.h. bei veränderter Größe der Zeichenfläche, soll auch der Punkt seine Größe ändern. Die Größe der Zeichenfläche lässt sich mit Hilfe der Umgebungsvariabeln width und height auslesen.
obligatorisch
Jetzt koppeln wir die Größe des Punktes an die Mausposition.
obligatorisch
Positionieren Sie diesmal zwei Punkte auf der X-Achse. Diesmal folgt der eine Punkt der Mausposition, der andere nimmt immer die gespiegelte Position ein. Auf der Y-Achse sind beide Punkte gleich zu positionieren, d.h. die Punkte auf y=height/2
zu platzieren. Somit überlagern sich die Punkte in der Mitte.
obligatorisch