Beispiel Drei Linien

Programm im Editor öffnen

Quellcode ohne Kommentar

function setup() {
  noLoop();
  
  createCanvas(400, 400);
  background(240);
  
  stroke(205, 51, 51);
  strokeWeight(5);
  line(100, 100, 300, 100);
  
  stroke(30, 144, 205);
  strokeWeight(10);
  line(100, 200, 300, 200);
  
  stroke(0, 180, 102);
  strokeWeight(20);
  line(100, 300, 300, 300);

}

Quellcode mit Kommentar

function setup() {
  // Dieses Programm ist statisch, also ohne Bewegung. 
  // Daher schaltet noLoop() das Neuzeichnen des Programmfensters aus:
  noLoop();
  
  createCanvas(400, 400);
  background(240);
  
  // Die obere, rote Linie:
  // Strichfarbe setzen:
  stroke(205, 51, 51);
  // Strichdicke setzen (in Pixel)
  strokeWeight(5);
  // line() zeichnet eine Linie.
  // Eine Linie verbindet bekanntlich zwei Punkte.
  // 100, 100 sind die Koordinaten des ersten Punktes
  // 300, 100 die des zweiten Punktes.
  line(100, 100, 300, 100);
  
  // Die mittlere, blaue Linie:
  stroke(30, 144, 205);
  strokeWeight(10);
  line(100, 200, 300, 200);
  
  // Die untere, grüne Linie:
  stroke(0, 180, 102);
  strokeWeight(20);
  line(100, 300, 300, 300);

}