Schidkröte  Turtle-Grafik mit PHP
 
       
   Grundsätzliches     Die ,,Schildkröten"-Grafik (Turtle-Grafik) wurde für die ersten Gehversuche von Primarschülern auf Computern entwickelt. Es hat sich aber bald gezeigt, dass sie ein gutes Hilfsmittel zur Erstellung von Zeichnungen auf dem Bildschirm darstellt. Darum hat sich die Idee der Turtle-Grafik auch ausserhalb der Primarschule durchgesetzt.

Die Idee ist folgende: Der Bildschirm entspricht einem Blatt Papier. Darauf steht eine kleine Schildkröte (nennen wir sie klex). Mit ihrem Schwanz, den sie heben und senken kann, kann sie beim Gehen eine Spur hinterlassen.

Die folgenden Beispiele verwenden immer klex als Beispiel eines Turtleobjektes. Als Namen für die Objekte können beliebige andere, in PHP zulässige Variablennamen, verwendet werden.

Turtleklasse zum ausprobieren

Die Turtlegrafik in PHP ist eine objektorientierte Lösung, d.h. man erzeugt sich ein TurtleGraph-Objekt (z.B. klex) und kann dann mittels verschiedener Methoden das Objekt manipulieren (siehe unten).

Durch das von Ihnen erstellte Programm wird eine Flashanimation erzeugt, die in einem Browser oder als Flashfilm in einem Flashplayer betrachtet werden kann. Insbesondere in einem Flashplayer kann die Flashanimation im Einzelschritten vor- (<strg>+Pleil nach rechts) oder zurück geblättert (<strg>+Pleil nach links) werden.


 
   TurtleGraph
Konstruktor 
 

$klex = new TurtleGraph( [int breite], [int hoehe], [string Stiftfarbe], [string Hintergrundfarbe], [float Anzahl Bilder/Sekunde], [bool Turtle] );

Diese Anweisung erzeugt das TurtleGraph-Objekt  $klex. Es ist daher immer die erste Anweisung! Danach können weitere Grafik- oder PHP-Anweisungen folgen. Alle Parameter sind optional.

Ein Aufruf der Methode ohne Parameter ($klex = new TurtleGraph; ) erzeugt ein "leeres" Zeichenblatt mit der folgenden Ausgangssituation:

  1. Die Turtle (als Dreieck symbolisiert) befindet sich im Punkt N(0|0), schaut in Richtung der x-Achse (Winkel = 0 Grad), der Stift ist "angehoben".
  2. Die Grafik hat eine Auflösung von 800 (Breite) * 700 (Höhe) Pixel.
  3. Die Stiftfarbe (Vordergrundfarbe) ist Schwarz, die Hintergundfarbe ist Weiß.
  4. Es werden 2 Schritte pro Sekunden angezeigt. Es können auch Zahlen zwischen 0 und 1 eingegeben werden (Bsp.: 0.5 entsprechen einem Bild in zwei Sekunden).
  5. Die Turtle wird angezeigt (mögliche Werte sind: true == Turtle wird angezeigt,
    false == Turtle wird nicht angezeigt).

 
   PenDown()   

$klex->PenDown();

Durch den Aufruf dieser Methode setzt die Schildkröte ihren Stift ab. Beim Herumgehen hinterlässt sie nun eine Linie, die wir sehen können.


 
   SetFGColor()   

$klex->SetFGColor ( [short red], [short green], [short blau] );

Durch den Aufruf dieser Methode wird die aktuelle Stiftfarbe der Schildkröte verändert. Der Definitionsbereich der optionalen Parameter ist jeweils 0..255. Dabei bedeutet 255, dass der entsprechende Farbwert maximal ist. Die Anweisung: $klex->SetFGColor( 255,255,255); setzt die Fordergrundfarbe auf Weiß.


 
   Forward()   

$klex->Forward( float dis );

Die Schildkröte (klex) bewegt sich um dis Einheiten vorwärts. Wenn der Stift ,,down" (siehe unten) ist, zeichnet sie dabei eine Linie.

$klex->PenDown; $klex->Forward (200);

 

 
   PenUp()   

$klex->PenUp();

Hier nimmt, wer hätte es gedacht, die Schildkröte klex ihren Stift vom (virtuellen) Papier. Wenn sie danach eine Forward-Anweisung erhält, bewegt sie sich, ohne zu zeichnen.

$klex->PenUp;$klex->Forward (200);


 
   Turn()   

$klex->Turn( float grad );

Dieser Befehl veranlasst die Schildkröte klex, sich um den Winkel grad zu drehen. Der Parameter grad liegt zwischen -360 und 360 Grad. Positive Winkel bewirken eine Drehung nach links, negative nach rechts (im Urzeigersinn). Zwei Beispiele:

$klex->turn(50);
$klex->turn(-135);

 

 
   ShowTurtle()   

$klex->ShowTurtle();

Mit ShowTurtle wird ein roter Pfeil angezeigt. Er symbolisiert die Schildkröte und zeigt die Richtung an. Dieser Pfeil wird beim Aufruf des Konstruktors ohne Parameter (siehe oben) angezeigt. Durch den Wahrheitswert true des "Turtleparameter" wird sie angezeigt, durch false wird sie nicht angezeigt.


 
   HideTurtle()  

$klex->HideTurtle();

Durch HideTurtle kann die Schildkröte, selbst wenn sie durch den Konstruktor erzeugt wurde, wieder ausgeblendet werden.


 
   ShowGrid()  

$klex->ShowGrid();

Durch Aufruf von ShowGrid wird ein grobes Gitter zur Orientierung angezeigt.


 
   SetPosition()   

$klex->SetPosition( int x, int y);

Mit SetPosition setzt man die Schildkröte an einen beliebigen Ort auf dem Bildschirm. Dabei zeichnet sie nicht. Die Parameter x und y liegen im dem durch den Konstruktor vorgegebenen Bereich.


 

 
   SetDirection()   

$klex->SetDirection( float grad );

Dieser Befehl ähnelt der Anweisung Turn. Mit SetDirection wird die Blickrichtung von kex auf den angegebenen Wert eingestellt, während $klex->Turn(); die Schildkröte um den angegebenen Wert dreht. Grad liegt, wie gehabt, zwischen -360 und 360.


 

 
   ShowPicture()    

$klex->ShowPicture();

Diese Methode der Klasse muss als letzte aufgerufen werden. Sie erzeugt die Flash-Animation.


 
   Vollständiges   Beispiel    

Vollständiges   Beispiel

Dieser Quellcode erzeugt die unten abgebildete Grafik. Wie zu sehen ist (Zeile 3), muss die TurtleGraph-Klasse in der Regel durch einen require-Befehl eingebunden werden.

Die Grafik Flash-Animation kann man in einem Browser anzeigen lassen, indem man eine Flashdatei einbindet.
Ein Beispiel ist unter http://de.selfhtml.org/html/multimedia/objekte.htm#flash genau beschrieben.

Hier sei die HTML4-Konforme Version vorgstellt:

    <object data="klexTestSWF.php" type="application/x-shockwave-flash" width="800" height="500">
    <param name="movie" value="klexTestSWF.php">
    <param name="quality" value="high">
    <param name="menu" value="true">
    <param name="loop" value="false">
    </object>
geschehen.


 
   Dateiliste    

Dateiliste

Zur Turtle-Klasse gehören die folgenden Datei:

  1. class/TurtleGraphSWF.class.php: Klassen-Datei der Turtle-Klasse.
  2. turtle_beschreibung.htm: Diese Datei lesen Sie gerade.
  3. template.php: Eine Vorlage-Datei.
  4. index.php: Diese Datei wird zur einfachen Auswahl und Anzeige fertiger PHP-Grafiken benutzt werden. Die grafikerzeugende Datei muss sich im gleichen Verzeichnis wie index.php befinden.
  5. KlexTestSWF.php: Beispiel PHP-Datei, welche die oben abgebildete Grafik erzeugt.
  6. Der Ordner images enhält die Grafiken für diese Datei.
  7. Im Ordner inc ist eine PHP-Datei mit Farbnamen.

 

 
   Author    

Author

Lutz Westphal, Lehrer am Berlin-Kolleg, eMail: lutz.westphal@web.de


 
   Hinweise    

Hinweise

Diese Klasse ist im Zusammenhang mit der Unterrichtsreihe:
"Leitprogramm: Rekursives Programmieren
"
der ETH (Eidgenössische Technische Hochschule Zurich) entstanden. Die Methoden dieser Klasse sind entsprechend den dort genannten Anforderungen bezeichnet.

Die Klasse kann nur funktionieren, wenn die ming für PHP installiert ist. Sie können dies feststellen, indem Sie die Funktion phpinfo(); benutzen. Ihr Server muss dann folgenden Bereich zeigen. Dies ist z.B bei der aktuellen XAMPP-Version der Fall.

Die Klasse, die Dokumentation und ein Beispiel können Sie als:
gezippte Datei (turtle.zip) ,
runterladen.