taralino

Flatternder Vogel

Beim ersten Spiel besteht die Aufgabe darin, einen flatternden Vogel durch Hindernisse fliegen zu lassen. Aber bevor eine Künstliche Intelligenz ins Spiel kommt, kannst du zunächst selbst einmal versuchen, den Vogel (dargestellt durch einen gelben Kreis) durch die Hindernisse (grüne Barrieren) flattern zu lassen.

Per Mausklick auf die Zeichenfläche flattert der Vogel einmal nach oben. Solltest du auf ein Hindernis treffen, startet das Spiel von vorne.

Das Spiel ist so aufgebaut, dass du (zumindest theoretisch) pro Sekunde 60 Mal nach oben flattern kannst. Und genau diese Aufgabe soll nachfolgend eine Künstliche Intelligenz übernehmen:

In jedem Simulationsschritt (60 pro Sekunde) entscheidet eine Künstliche Intelligenz, ob der Vogel flattern soll oder nicht.

Alle Hindernisse werden (in ihrer vertikalen Ausrichtung) zufällig erzeugt. Zudem möchten wir sicherstellen, dass das Spiel endlich ist:

Von Hindernis zu Hindernis wird die Lücke, durch die es zu flattern gilt, ein wenig kleiner.

Den nachfolgenden Quellcode musst du nicht im Detail durcharbeiten. Er ist aber dargestellt, um Interessierten zu zeigen, wie das Spiel implementiert wurde.

Quellcode

Klicke auf die Zeichenfläche, um den Vogel (gelber Kreis) flattern zu lassen.

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <script src="taralino.js"></script>
</head>
<body>
<script>

// Spieler
var x = 20; // x-Position
var y = 20; // y-Position
var r = 3; // Radius
var v = 0; // Geschwindigkeit in y-Richtung

// Hindernisse
var ar = 4; // Radius (halbe Breite) der Hindernisse
var ax = 40; // Abstand zwischen Hindernissen in x-Richtung
var ay = 30; // Vertikale Luecke in Hindernissen
var an = 6; // Anzahl der Hindernisse
var H = []; // Datenfeld der Hindernisse

// Zaehler
var c = 0;
var cmax = 0;


function spiel_setup() {
  y = 20;
  v = 0;
  ay = 30;
  c = 0;
  H = [];
  for (var k = 0; k < an; k++) {
    var h = random(15,45);
    H.push([120+k*ax, h-ay/2, h+ay/2]);
  }
};

function setup() {
  spiel_setup();
  Canvas.init([0,100], [0,60], {width:600, background:"lightgrey"});
  Animation.init({fps:60});
};

function spiel_physik() {
  // Spieler
  v = v - 0.08;
  y = y + v;
  if (y < 0) v = 1.4;
  if (y > 60) y = 60;
  // Hindernisse
  for (var k = 0; k < an; k++) {
    H[k][0] = H[k][0] - 0.5;
    if (H[k][0] < -10) {
      ay = ay*0.99;
      var h = random(15,45);
      H[k] = [H[k][0] + an*ax, h-ay/2, h+ay/2];
    }
  }
};

function spiel_zeichnen() {
  Canvas.clear();
  // Spieler
  Canvas.circle(x, y, r, {fill:"yellow"});
  // Hindernisse
  for (var k = 0; k < an; k++) {
    Canvas.circle(H[k][0], H[k][1], ar, {fill:"green"});
    Canvas.rect(H[k][0], H[k][1]-50, 2*ar, 100, {fill:"green"});
    Canvas.circle(H[k][0], H[k][2], ar, {fill:"green"});
    Canvas.rect(H[k][0], H[k][2]+50, 2*ar, 100, {fill:"green"});
  }
  // Zaehler
  c = c + 1;
  if (c > cmax) cmax = c;
  Canvas.text( 2, 57, "aktuelle Strecke:", {align:"left"});
  Canvas.text(28, 57, c, {align:"right"});
  Canvas.text( 2, 54, "maximale Strecke:", {align:"left"});
  Canvas.text(28, 54, cmax, {align:"right"});
};

function abstand_punkt_linie(x, y, z, y1, y2) {
  // Annahme: y1 <= y2
  if (y <= y1) return Math.sqrt((x-z)*(x-z) + (y-y1)*(y-y1));
  if (y >= y2) return Math.sqrt((x-z)*(x-z) + (y-y2)*(y-y2));
  return Math.abs(x-z);
};

function spiel_kollision() {
  for (var k = 0; k < an; k++) {
    var b1 = abstand_punkt_linie(x, y, H[k][0], H[k][1]-100, H[k][1]);
    var b2 = abstand_punkt_linie(x, y, H[k][0], H[k][2], H[k][2]+100);
    if ((b1 < r+ar) || (b2 < r+ar)) spiel_setup();
  }
};

function loop() {
  spiel_physik();
  spiel_zeichnen();
  spiel_kollision();
};

function on_mouse_down(x, y) {
  v = 1.4;
};

</script>
</body>
</html>

Vorschau Download Kopie speichern

Aufgabe

Mache dich mit dem Spiel vertraut und versuche, möglichst weit zu flattern. Wie weit schaffst du es?