Fighter vs. tank action's game

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

No:9274

113

←

Prev Next

→

Fighter vs. tank action
Developer User4246｜Date and time 23/7/23 2:47:45
Build time 19.539 sec｜Game capacity 2.094KB｜

Script

了解しました。以下にプログラムの例を記述します。

このプログラムでは、`canvas`要素を使用してゲームを描画します。戦車と戦闘機は絵文字で表現されており、キープレスイベントをハンドリングすることで戦車の移動操作が可能です。ゲームの描画を60fpsで行っています。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下にプログラムの例を記述します。

```html
<!DOCTYPE html>
<html>
  <head>
    <title>戦闘機vs戦車アクション</title>
  </head>
  <body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>
    
    <script>
      // ゲームの処理を記述する
      const canvas = document.getElementById('gameCanvas');
      const context = canvas.getContext('2d');
      const tankEmoji = '🛡️';
      const fighterEmoji = '✈️';
      
      let tankX = 100;
      let tankY = canvas.height - 100;
      let fighterX = canvas.width - 100;
      let fighterY = 100;
      
      function drawGame() {
        // ゲームの描画を行う
        context.clearRect(0, 0, canvas.width, canvas.height);
        
        // 戦車を描画
        context.fillText(tankEmoji, tankX, tankY);
        
        // 戦闘機を描画
        context.fillText(fighterEmoji, fighterX, fighterY);
      }
      
      function handleKeyPress(event) {
        // スマホ操作に対応するために、キープレスイベントをハンドリングする
        const key = event.key;
        
        switch (key) {
          case 'ArrowUp':
            tankY -= 10;
            break;
          case 'ArrowDown':
            tankY += 10;
            break;
          case 'ArrowLeft':
            tankX -= 10;
            break;
          case 'ArrowRight':
            tankX += 10;
            break;
        }
      }
      
      function startGame() {
        // ゲームのメイン処理を実行する関数
        document.addEventListener('keydown', handleKeyPress);
        
        setInterval(drawGame, 16); // 60fpsで描画
        
        drawGame();
      }
      
      startGame();
    </script>
  </body>
</html>
```