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

No:10259

155

←

Prev Next

→

man who is easily compelled into giving up on his ..ALL
Developer User3840｜Date and time 23/7/29 18:46:08
Build time 12.645 sec｜Game capacity 2.681KB｜

Script

了解です。以下にプログラム例を示します。

ジバクくん

ジバクくんを操作して敵を避けてください。

このプログラムは、canvas要素を用いたシンプルなゲームです。黄色い円がジバクくん、赤い円が敵です。ジバクくんをスマホのタッチ操作で動かし、敵と衝突しないように避けてください。ゲームオーバー時にはアラートが表示され、スコアが表示されます。

←

Prev　Next

→ 　

Back　

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

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

了解です。以下にプログラム例を示します。

```html
<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>ジバクくん</title>
</head>
<body>
  <h1>ジバクくん</h1>
  <p>ジバクくんを操作して敵を避けてください。</p>
  <canvas id="gameCanvas" width="500" height="500"></canvas>

function drawPlayer() {
      context.beginPath();
      context.arc(playerX, playerY, playerRadius, 0, Math.PI * 2);
      context.fillStyle = 'yellow';
      context.fill();
      context.closePath();
    }

function drawEnemy() {
      context.beginPath();
      context.arc(enemyX, enemyY, enemyRadius, 0, Math.PI * 2);
      context.fillStyle = 'red';
      context.fill();
      context.closePath();
    }

function update() {
      context.clearRect(0, 0, canvas.width, canvas.height);

drawPlayer();
      drawEnemy();

if (playerX + playerRadius >= canvas.width || playerX - playerRadius <= 0 ||
          playerY + playerRadius >= canvas.height || playerY - playerRadius <= 0) {
        alert('ゲームオーバー！ スコア: ' + score);
        document.location.reload();
      }

const dx = enemyX - playerX;
      const dy = enemyY - playerY;
      const distance = Math.sqrt(dx * dx + dy * dy);
      
      if (distance < playerRadius + enemyRadius) {
        alert('ゲームオーバー！ スコア: ' + score);
        document.location.reload();
      }

playerX += (dx / distance) * playerSpeed;
      playerY += (dy / distance) * playerSpeed;

score++;
      requestAnimationFrame(update);
    }

document.addEventListener('touchstart', function (e) {
      const touchX = e.touches[0].clientX;
      const touchY = e.touches[0].clientY;

playerX = touchX;
      playerY = touchY;
    });

update();
  </script>
</body>
</html>
```