Hanischbor//Mathe/Turtle
Aus ProgrammingWiki
Wiki-Quelltext dieser Seite.
== Wie zeichnet eine Turtle? ==
Wir stellen uns vor: Eine kleine Schildkröte (engl. turtle) besitzt am Bauch einen Zeichenstift und gehorcht aufs Wort!<br />
Diese Schildkröte kann sich auf einer Spielwiese tummeln, die wir als Zeichenfläche (engl. canvas) bezeichnen.<br />
Da es mehrere "schlaue" Schildkröten und mehrere Spielwiesen gibt, geben wir jeder Schildkröte und jeder Spielwiese eine Nummer.<br />
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top">
'''Turtle1 auf Zeichenfläche1:'''
<canvas w="400" h="300"></canvas>
</td>
<td> </td>
<td align="center" valign="top">
'''Turtle2 auf Zeichenfläche2:'''
<canvas w="400" h="300"></canvas>
</td>
</tr>
<tr>
<td colspan="3">
Wir wollen die nachfolgenden Anweisungen ausführen und anschließend vergleichen.
</td>
</tr>
<tr>
<td align="center" valign="top">
<run id="5360366cdf1ae">
canvas1.clear();
turtle1.move(200,150);
turtle1.forward(50);
turtle1.right(90);
turtle1.forward(50);
turtle1.right(90);
turtle1.forward(50);
turtle1.right(90);
turtle1.forward(50);
</run>
</td>
<td> </td>
<td align="center" valign="top">
<run>
public void quadrat(double x) {
for (int i = 1; i <= 4; i++) {
turtle2.forward(x);
turtle2.right(90);
}
}
canvas2.clear();
turtle2.move(200,150);
quadrat(50);
</run>
</td>
</tr>
</table>
Vergleichend stellen wir fest:
* Die Darstellungen sind zunächst identisch.
* Gleiche Anweisungen lassen sich in ''Wiederholungen'' (Zählschleifen) beliebig oft ausführen.
* Anweisungen können modularisiert, d.h. in ''Prozeduren'' unter einem geeigneten ''Bezeichner'' (Namen) zusammengfasst werden.
* Prozeduren können ''Parameter'' (Platzhalter) haben, die z.B. Objekte in variabler Größe zeichnen lassen.
<br />
== Turtle-Befehle ==
Die folgende Tabelle enthält die wesentlichsten Sprachelemente der Turtle-Grafik.
<table border="1" cellspacing="1" cellpadding="8">
<tr>
<td><b>Syntax</b></td><td><b>Semantik</b></td>
</tr>
<tr valign="top">
<td><tt>canvas.clear();</tt></td>
<td>löscht die Zeichenfläche,</td>
</tr>
<tr valign="top">
<td><tt>turtle.move(<x>,<y>);</tt></td>
<td>positioniert die Turtle in der Zeichenfläche,<br />
x ... Spaltenkoordinate, y ... Zeilenkoordinate,<br />
der Koordinatenursprung befindet sich in der ''linken oberen'' Ecke der Zeichenfläche,</td>
</tr>
<tr valign="top">
<td><tt>turtle.forward(<x>);</tt></td>
<td>lässt die Turtle x Schritte vorwärts gehen,</td>
</tr>
<tr valign="top">
<td><tt>turtle.backward(<x>);</tt></td>
<td>lässt die Turtle x Schritte zurück gehen,</td>
</tr>
<tr valign="top">
<td><tt>turtle.right(<x>);</tt></td>
<td>dreht die Turtle um x Grad nach rechts,</td>
</tr>
<tr valign="top">
<td><tt>turtle.left(<x>);</tt></td>
<td>dreht die Turtle um x Grad nach links,</td>
</tr>
<tr valign="top">
<td><tt>turtle.penDown();</tt></td>
<td>setzt den Stift ab, so dass Turtle-Bewegungen eine Spur hinterlassen,</td>
</tr>
<tr valign="top">
<td><tt>turtle.penUp();</tt></td>
<td>hebt den Stift an, so dass Turtle-Bewegungen keine Spur hinterlassen,</td>
</tr>
<tr valign="top">
<td><tt>turtle.penWidth(<x>);</tt></td>
<td>setzt die Breite des Stiftes auf den Wert x,</td>
</tr>
<tr valign="top">
<td><tt>turtle.penColor(<r>,<g>,<b>);</tt></td>
<td>legt den Fabwert des Stiftes fest,<br />
mögliche Zahlenwerte für rot (r), grün (g) und blau (b) sind: 0 ... 255,</td>
</tr>
<tr valign="top">
<td><tt>turtle.hide();</tt></td>
<td>macht die Turtle unsichtbar,</td>
</tr>
<tr valign="top">
<td><tt>turtle.show();</tt></td>
<td>macht die Turtle sichtbar,</td>
</tr>
<tr valign="top">
<td><tt>turtle.penErase();</tt></td>
<td>die Turtle löscht eine gezeichnete Linie (wie ein Radiergummi),</td>
</tr>
</table>
<br />
== Vom Dreieck zum N-Eck ==
Ergänze zunächst die Prozedur zum Zeichnen eines gleichseitigen Dreiecks. Verallgemeinere dann die Lösung zur Darstellung regelmäßiger N-Ecke.
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top">
'''Gleichseitiges Dreieck:'''
<code>
public void dreieck(double x) {
}
</code>
</td>
<td> </td>
<td align="center" valign="top">
'''Regelmäßiges N-Eck:'''
<code>
public void n_eck(double x, int n) {
double winkel = 360 / n;
}
</code>
</td>
</tr>
<tr>
<td align="center" valign="top">
<canvas w="400" h="300"></canvas>
</td>
<td> </td>
<td align="center" valign="top">
<canvas w="400" h="300"></canvas>
</td>
</tr>
<tr>
<td align="center" valign="top">
<run>
canvas3.clear();
turtle3.move(200,150);
dreieck(50);
</run>
</td>
<td> </td>
<td align="center" valign="top">
<run>
canvas4.clear();
turtle4.move(200,150);
n_eck(50,7);
</run>
</td>
</tr>
</table>
== Prozeduren rufen Prozeduren auf ==
In einer Turtlegrafik können komplexe Figuren mit bereits definierten Prozeduren beschrieben werden. So lässt sich ein Haus aus 2 regelmäßigen N-Ecken zusammensetzen. Natürlich muss auch hier die Prozedur <tt>n_eck</tt> zuvor definiert werden.
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td align="center" valign="top">
<canvas w="300" h="450"></canvas>
</td>
<td> </td>
<td align="center" valign="top" width="400">
<code>
public void n_eck(double x, int n) {
double winkel = 360 / n;
}
public void haus(double x) {
n_eck(x, 4);
turtle5.forward(x);
turtle5.right(30);
n_eck(x, 3);
}
</code>
<run>
canvas5.clear();
turtle5.move(50, 400);
haus(200);
</run>
</td>
</tr>
</table>