AI game creator

Click here for free DL of the app version that can save data.

No:10912

←

Prev Next

→

Snake game
Developer User4614｜Date and time 23/8/5 20:34:38
Build time 42.454 sec｜Game capacity 5.229KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html>
<head>
   <style>
      canvas {
        border: 1px solid #000;
        display: block;
        margin: 20px auto;
      }
   </style>
</head>
<body>
   <canvas id="gameCanvas" width="400" height="400"></canvas>

// Festlegen der Größe und Startposition der Schlange
         var snakeSize = 20; // Größe einer Schlange in Pixeln
         var snake = [{x: 200, y: 200}]; // Startposition der Schlange
         var direction = "right"; // Anfangsrichtung der Schlange

// Festlegen der Größe und Startposition des Apfels
         var appleSize = 20; // Größe eines Apfels in Pixeln
         var apple = {x: 0, y: 0}; // Startposition des Apfels

// Funktion zum Zeichnen eines Elements (Schlange oder Apfel)
         function drawElement(element, size, color) {
            ctx.fillStyle = color;
            ctx.fillRect(element.x, element.y, size, size);
         }

// Funktion zum Zeichnen des Spielfelds
         function drawGame() {
            ctx.clearRect(0, 0, canvas.width, canvas.height); // Spielfeld löschen

// Schlange zeichnen
            for (var i = 0; i < snake.length; i++) {
               drawElement(snake[i], snakeSize, "#000");
            }

// Apfel zeichnen
            drawElement(apple, appleSize, "#f00");
         }

// Funktion zum Bewegen der Schlange
         function moveSnake() {
            var head = {x: snake[0].x, y: snake[0].y}; // Kopiere den Kopf der Schlange

// Bewege den Kopf der Schlange basierend auf der Richtung
            if (direction === "right") head.x += snakeSize;
            if (direction === "left") head.x -= snakeSize;
            if (direction === "up") head.y -= snakeSize;
            if (direction === "down") head.y += snakeSize;

// Füge den neuen Kopf der Schlange hinzu
            snake.unshift(head);

// Überprüfe, ob die Schlange den Apfel gegessen hat
            if (head.x === apple.x && head.y === apple.y) {
               // Erzeuge einen neuen Apfel an einer zufälligen Position
               generateApple();

// Vergrößere die Schlange
               // Hier kannst du beliebige Regeln für die Verlängerung der Schlange hinzufügen
               // Zum Beispiel: snakeSize += 20; für 20 Pixel Verlängerung
            } else {
               // Entferne das letzte Element der Schlange (Schwanz)
               snake.pop();
            }
         }

// Funktion zum Generieren eines neuen Apfels
         function generateApple() {
            var maxX = canvas.width - appleSize;
            var maxY = canvas.height - appleSize;

// Generiere zufällige Position innerhalb des Spielfelds
            apple.x = Math.floor(Math.random() * maxX / snakeSize) * snakeSize;
            apple.y = Math.floor(Math.random() * maxY / snakeSize) * snakeSize;
         }

// Funktion zum Überprüfen, ob das Spiel beendet wurde
         function checkGameOver() {
            var head = snake[0];
            
            // Überprüfe, ob die Schlange das Spielfeld verlassen hat
            if (
               head.x < 0 || head.x >= canvas.width ||
               head.y < 0 || head.y >= canvas.height
            ) {
               return true; // Das Spiel ist beendet
            }

// Überprüfe, ob die Schlange mit sich selbst kollidiert
            for (var i = 1; i < snake.length; i++) {
               if (head.x === snake[i].x && head.y === snake[i].y) {
                  return true; // Das Spiel ist beendet
               }
            }

return false; // Das Spiel läuft weiter
         }

// Funktion zum Aktualisieren des Spiels
         function updateGame() {
            if (checkGameOver()) {
               clearInterval(gameInterval);
               alert("Spiel vorbei!"); // Anpassen der Meldung

// Füge hier beliebige Spielende-Aktionen hinzu
               // Zum Beispiel: Neustart des Spiels
            } else {
               moveSnake();
               drawGame();
            }
         }

// Funktion zum Ändern der Richtung basierend auf Benutzereingaben
         function changeDirection(event) {
            if (event.keyCode === 37 && direction !== "right") {
               direction = "left";
            } else if (event.keyCode === 38 && direction !== "down") {
               direction = "up";
            } else if (event.keyCode === 39 && direction !== "left") {
               direction = "right";
            } else if (event.keyCode === 40 && direction !== "up") {
               direction = "down";
            }
         }

// Generiere den ersten Apfel
         generateApple();

// Starte das Spiel
         var gameInterval = setInterval(updateGame, 100);

// Erfasse Benutzereingaben
         document.addEventListener("keydown", changeDirection);
      };
   </script>
</body>
</html>