Lernpfad:Programmierung mit Javascript und p5js/Die zwei Funktionen setup und draw: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
Thi (Diskussion | Beiträge) (Die Seite wurde neu angelegt: „==Die zwei Funktionen setup und draw== Alle Projekte in p5js heißen ''sketches'' und beinhalten mindestens zwei Funktionen: * '''setup''': wird genau einmal a…“) |
Thi (Diskussion | Beiträge) |
||
Zeile 1: | Zeile 1: | ||
==Die zwei Funktionen setup und draw== | ==Die zwei Funktionen setup und draw== | ||
Alle Projekte in p5js heißen ''sketches'' und beinhalten mindestens zwei Funktionen: | Alle Projekte in p5js heißen ''sketches'' und beinhalten mindestens zwei Funktionen: | ||
* '''setup''': wird genau einmal am Anfang der Ausführung aufgerufen. Hier kann z.B. das Zeichenfeld verändert werden. createCanvas(200, 200); erstellt z.B. ein Zeichenfeld mit 200 x 200 Pixeln. | * '''draw''': wird standardmäßig 30 mal in der Sekunde aufgerufen. | ||
** | * '''setup''': wird genau einmal am Anfang der Ausführung aufgerufen. Hier kann z.B. das Zeichenfeld verändert werden. createCanvas(200, 200); erstellt z.B. ein Zeichenfeld mit 200 x 200 Pixeln. Man darüber hinaus | ||
* '''draw | ** mit der Funktion '''frameRate()''' einstellen, wie oft die draw-Funktion in der Sekunde aufgerufen wird. | ||
** mit der Funktion '''noLoop()''' einstellen, ob die draw-Funktion wiederholt aufgerufen wird oder nur einmal aufgerufen werden soll. | |||
Das folgende Beispiel zeigt noch einmal die Verwendung der beiden Funktionen: | |||
<syntaxhighlight lang="javascript" line="1" > | |||
function setup() { | |||
createCanvas(100, 100); | |||
frameRate(1); //Die draw-Funktion wird nur einmal pro Sekunde aufgerufen. | |||
} | |||
function draw() { | |||
background(220); | |||
console.log(frameCount); //console.log gibt einen Text in der Konsole aus. | |||
} | |||
</syntaxhighlight> | |||
Erläuterungen zum Programm: | |||
*In Zeile 3 wird die Wiederholungsgeschwindigkeit für das Zeichenen der draw-Funktion eingestellt. | |||
*In Zeile 8 wird mit dem Wert ''frameCount'' ausgegeben, wie oft die Funktion draw schon aufgerufen wurde. |
Version vom 26. Dezember 2018, 22:47 Uhr
Die zwei Funktionen setup und draw
Alle Projekte in p5js heißen sketches und beinhalten mindestens zwei Funktionen:
- draw: wird standardmäßig 30 mal in der Sekunde aufgerufen.
- setup: wird genau einmal am Anfang der Ausführung aufgerufen. Hier kann z.B. das Zeichenfeld verändert werden. createCanvas(200, 200); erstellt z.B. ein Zeichenfeld mit 200 x 200 Pixeln. Man darüber hinaus
- mit der Funktion frameRate() einstellen, wie oft die draw-Funktion in der Sekunde aufgerufen wird.
- mit der Funktion noLoop() einstellen, ob die draw-Funktion wiederholt aufgerufen wird oder nur einmal aufgerufen werden soll.
Das folgende Beispiel zeigt noch einmal die Verwendung der beiden Funktionen:
function setup() {
createCanvas(100, 100);
frameRate(1); //Die draw-Funktion wird nur einmal pro Sekunde aufgerufen.
}
function draw() {
background(220);
console.log(frameCount); //console.log gibt einen Text in der Konsole aus.
}
Erläuterungen zum Programm:
- In Zeile 3 wird die Wiederholungsgeschwindigkeit für das Zeichenen der draw-Funktion eingestellt.
- In Zeile 8 wird mit dem Wert frameCount ausgegeben, wie oft die Funktion draw schon aufgerufen wurde.