taralino

Das Spielfeld

Wie beim Game of Life definieren wir ein quadratisches Spielfeld, welche aus Zeilen und Spalten besteht. Neben den Zuständen 0 und 1 kann jede Zelle beim Smooth Life allerdings auch jeden Wert zwischen 0 und 1 annehmen. Wir beschreiben das Spielfeld als Funktion mit

Dabei ist eine Zelle des Spielfeldes und der Simulationsschritt.

Um das Spielfeld entsprechend darzustellen, wählen wir eine Farbcodierung: Zellen mit dem Wert 0 werden in Dunkelblau (nahezu Schwarz) veranschaulicht, Zellen mit dem Wert 1 in Grün. Für die Werte dazwischen verwenden wir den folgenden Farbverlauf.

Unter Verwendung dieser Farbgebung wird im folgenden Quellcode ein Spielfeld dargestellt.

Exkurs

Wir haben mit dem Spielfeld bereits eine erste Diskretisierung gewählt. Im kontinuierlichen Modell beschreiben wir das Spielfeld durch eine Funktion mit

Dabei beschreibt den Ort auf dem Spielfeld und die Zeit.

Quellcode

Es wird eine Startkonfiguration mit Werten zwischen 0 und 1 erzeugt sowie dargestellt.

<!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>

/*************************************************
  Parameter
*************************************************/

// Spielfeldgroesse
var q = 24;



/*************************************************
  Spielfeld und Startkonfiguration
*************************************************/

var S = [];
for (var i = 0; i < q; i++) S.push([]);
for (var i = 0; i < q; i++) for (var j = 0; j < q; j++) S[i].push(0);

for (var i = 0; i < q; i++) for (var j = 0; j < q; j++) {
  var h = 0.5 + 0.5 * (Math.cos(Math.PI*4*j/q) * Math.cos(Math.PI*2*i/q));
  S[i][j] = h;
};



/*************************************************
  main
*************************************************/

function draw() {
  var P = Picture.colorize(S, [0,0.3,1], [[3,12,20],[26,124,208],[66,188,53]]);
  for (var i = 0; i < q; i++) for (var j = 0; j < q; j++) Grid.pixel(j, i, P[i][j]);
  Grid.draw();
};

function setup() {
  Grid.init(q, q, {style:"canvas", zoom:Math.max(1,Math.floor(400/q))});
  draw();
};


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

Vorschau Download Kopie speichern

Zur Darstellung des Spielfeldes wird das Grid-Paket verwendet:

Zur Referenz

Um die Werte zuvor auf den Farbverlauf abzubilden, greifen wir auf die Funktion Picture.colorize zurück:

Zur Referenz