Canvas und Turtle

Aus ProgrammingWiki

Beispiel 1

Das nachfolgende Beispiel zeichnet einen farbigen Kreis. Versuche durch leichte Anpassung die Anzahl der Kreissegmente zu verdoppeln ohne den Radius des Kreises zu vergrößern.

canvas.clear(); // Zeichenfläche löschen turtle.move(200,100); // Turtle in die Mitte stellen var isUp = false; for(var i = 0; i < 18; i++){ turtle.penColor(i*10+50,0,250-10*i); turtle.penWidth(10); turtle.forward(20); turtle.right(20); isUp = !isUp; if(isUp) turtle.penUp(); else turtle.penDown(); }

ausführen

Beispiel 2

Das folgende Beispiel verwendet zwei Turtles Bob und Eva. Bob ist betrunken und läuft verwirrt herum, während Eva versucht ihn wieder einzufangen. Eva wird immer langsamer während sie läuft, denn Bob zu jagen ist anstrengend. Schau dir den folgenden Quelltext an und versuch ihn zu verstehen. Was könntest du am Programm ändern, damit Eva nicht mehr so schnell erschöpft ist?

canvas2.clear(); // Zeichenfläche löschen var Bob = new Turtle(2); Bob.penColor(255,0,0); Bob.move(300,200); var Eva = new Turtle(2); Eva.penColor(0,255,0); Eva.move(50,50); var abstand; for(var step = 0; step < 500; step++) { Eva.setAngleTo(Bob); Eva.forward((500-step)/250.0); Bob.forward(5 * Math.random()); if (step%2 == 0) Bob.right(90 * Math.random()); else Bob.left(90 * Math.random()); // Abstand berechnen abstand = Math.sqrt((Eva.x - Bob.x)*(Eva.x - Bob.x)+(Eva.y - Bob.y)*(Eva.y - Bob.y)); if(abstand < 5) { console.log("Eva hat Bob gefangen!"); break; } } if(abstand >= 5) { console.log("Eva kann nicht mehr! Ihr fehlten rund "+Math.round(abstand)+" Meter."); }

ausführen

Da Bob zufällig läuft, starte das Programm mehrmals.