Turtle Zeichnen 1

Aus ProgrammingWiki

Bisher mussten Zeichenbefehle in einzelnen "Turtle-Sätzen" erteilt werden. Das war oft mühselig.
Wir wollen nun erfahren, wie eine Turtle die Befehle zum Zeichnen einer beliebigen Figur lernen kann.

Inhaltsverzeichnis 1 Wie lernt eine Turtle? 1.1 Zusammenfassung 2 Die Turtle lernt, das Nikolaus-Haus in einem Zug zu zeichnen 2.1 Die Turtle zeichnet ein Nikolaus-Haus mit fester Größe 2.1.1 Aufgaben 2.2 Die Turtle zeichnet ein Nikolaus-Haus mit veränderlicher Größe 2.2.1 Die Turtle rechnet 2.2.2 Die Turtle zeichnet 2.2.3 Aufgaben 2.2.4 Quelle

Wie lernt eine Turtle?

Die ersten beiden Turtles sollen lernen, wie ein Quadrat auf ihre Spielwiese gezeichnet wird.
Sie gehen dabei unterschiedlich vor:

function center(turtle) { turtle.move(200, 150); } function black(turtle) { turtle.penColor(0, 0, 0); } function red(turtle) { turtle.penColor(255, 0, 0); } function brown(turtle) { turtle.penColor(100, 50, 0); } function orange(turtle) { turtle.penColor(255, 100, 0); } function yellow(turtle) { turtle.penColor(255, 200, 0); } function green(turtle) { turtle.penColor(0, 255, 0); } function blue(turtle) { turtle.penColor(0, 0, 255); } function pink(turtle) { turtle.penColor(200, 50, 200); }

function quadrat1() { canvas1.clear(); turtle1.move(200, 150); turtle1.forward(100); turtle1.right(90); turtle1.forward(100); turtle1.right(90); turtle1.forward(100); turtle1.right(90); turtle1.forward(100); } quadrat1(); ausführen

function quadrat2(s) { canvas2.clear(); turtle2.move(200, 150); turtle2.forward(s); turtle2.right(90); turtle2.forward(s); turtle2.right(90); turtle2.forward(s); turtle2.right(90); turtle2.forward(s); } quadrat2(100); ausführen

Beide Turtles haben gelernt, was bei der Anweisung quadrat zu tun ist.
Nenne Gemeinsamkeiten und Unterschiede, die zwischen den beiden Ausführungen bestehen.

Zusammenfassung

• Die Turtle lernt mit der Definition einer Funktion:

  function <Name>(<Parameter1>, <Parameter2>, ...) {
   ...
  }
  

  Dabei wird ein aussagekräftiger Name (hier: <Name>) an eine Folge von Turtle-Anweisungen gebunden. Wird bei dieser Folge von Anweisungen kein Wert zurückgegeben, sprechen wir von einer Prozedur.

• Zwischen den geschweiften Klammern können mehrere Turtle-Sätze zu einem "Turtle-Text" zusammengefasst werden.
• In der Parameterliste

  (<Parameter1>, <Parameter2>, ...)

  lassen sich Werte übegeben, mit denen die Anweisungen in den Funktionen vervollständigt werden.
  Diese Parameterliste kann auch wie bei quadrat1 leer sein.

• Achte darauf, dass stets auf jede geöffnete geschweifte Klammer eine schließende geschweife Klammer folgen muss.

Die Turtle lernt, das Nikolaus-Haus in einem Zug zu zeichnen

Die Turtle zeichnet ein Nikolaus-Haus mit fester Größe

Die dritte Turtle möchte lernen, wie ein Nikolaus-Haus in einem Zug gezeichnet wird.
Du sollst ihr Lehrer sein. Lerne ihr das Zeichnen des Nikolaus-Hauses nach dem Vorbild von quadrat(100);.
Natürlich kannst Du dazu wieder alle erforderlichen Übersicht über alle Turtle-Befehle nachlesen.

Planfigur: Nikolaus-Haus mit fester Größe

function nikolaushaus1() { turtle3.move(200, 200); //Anweisungen }

canvas3.clear(); nikolaushaus1();

ausführen

Aufgaben

1. Ändere die Definition so ab, dass das Dach des Nikolaus-Hauses in einer anderen Farbe gezeichnet wird.
2. Welche Zahlenwerte müssten wie geändert werden, damit das Nikolaus-Haus in doppelter Größe gezeichnet wird?

Die Turtle zeichnet ein Nikolaus-Haus mit veränderlicher Größe

Die Turtle rechnet

Um ein Nikolaus-Haus in veränderlicher Größe zu zeichnen, muss die Turtle die Längen der Dachkanten und Diagonalen berechnen können. Wie rechnen eigentlich Turtles?
Wir untersuchen die Grundrechenarten:

3 + 5; ausführen

12.5 - 3.4; ausführen

Math.sqrt(2) * 100; ausführen

Math.round(17 / 3); ausführen

Bei Berechnungen können auch Variablen benutzt werden.
Dazu muss die Turtle den Wert einer Variablen kennen:

var s = 100; var x = Math.sqrt(2);

x * s;

ausführen

Wir fassen zusammen:

• Turtles führen Berechnungen in Turtle-Sätzen durch, die mit eine Semikolon abgeschlossen werden.
• Als Dezimalzeichen muss immer ein Punkt gesetzt werden.
• Es können mathematische Standardfunktionen benutzt werden.
• Berechnungen werde auch mit Variablen durchgeführt.

Die Turtle zeichnet

Nun kann die vierte Turtle das Nikolaus-Haus in veränderlicher Größe zeichnen.
Hilf ihr dabei. Orientiere Dich dazu an der nebenstehenden Planfigur.

Planfigur: Nikolaus-Haus mit veränderlicher Größe

function nikolaushaus2_lsg(turtle, s) { turtle.move(200, 200); turtle.penUp(); turtle.backward(s / 2); turtle.left(90); turtle.forward(s / 2); turtle.right(90); turtle.penDown(); turtle.forward(s); turtle.right(45); red(turtle); turtle.forward(s / Math.sqrt(2)); turtle.right(90); turtle.forward(s / Math.sqrt(2)); black(turtle); turtle.right(135); turtle.forward(s); turtle.left(135); turtle.forward(s * Math.sqrt(2)); turtle.right(135); turtle.forward(s); turtle.right(135); turtle.forward(s * Math.sqrt(2)); turtle.right(135); turtle.forward(s); }

function nikolaushaus2(turtle, s) { turtle.move(200, 200); //Anweisungen }

Hinweis: Es ist sinnvoll, jede Grafik-Prozedur mit einem zusätzlichen Parameter turtle zu ergänzen, mit dem entschieden werden kann, durch welche Turtle diese Prozedur genutzt werden soll. Dann könnte die Anweisung nikolaushaus2 von turtle4 ebenso genutzt werden wie von von einer weiteren möglichen turtle5:

canvas4.clear(); nikolaushaus2(turtle4, 100);

ausführen

Aufgaben

1. Ändere die Definition so ab, dass gesamte Nikolaus-Haus mehrfarbig gezeichnet wird.
2. Kannst du das Nikolaus-Haus genau in der Mitte der Spielwiese zeichnen lassen?

Quelle

Gymnasium Löbau