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

No:5123

8264

←

Prev Next

→

A large beckoning cat scatters a shower of money a..ALL
Developer User3812｜Date and time 23/6/29 18:56:36
Build time 45.525 sec｜Game capacity 4.738KB｜

Script

大招き猫がお金のシャワーをばらまく竜巻ゲームを作りましょう。以下は、HTMLファイルに実装されたJavaScriptコードの例です。

大招き猫のゲーム

このゲームでは、大きな招き猫が画面内を動き回りながらお金のシャワーを浴びることが目的です。画面に触れると、大招き猫はその位置に移動します。お金はゲーム画面の上端から様々な速さで降ってきます。大招き猫がお金に触れると、それを受け取ることができます。一方、竜巻は画面内を移動し、大招き猫と接触するとゲームオーバーになります。ただし、上記のコードは一例です。ゲーム性やデザインをより高度にするためには、さらに機能や要素を追加する必要があるかもしれません。

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいものランキング

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

大招き猫がお金のシャワーをばらまく竜巻ゲームを作りましょう。

以下は、HTMLファイルに実装されたJavaScriptコードの例です。

```html
<!DOCTYPE html>
<html>
<head>
    <title>大招き猫のゲーム</title>
</head>
<body>
    <h1>大招き猫のゲーム</h1>
    <canvas id="gameCanvas" width="400" height="400"></canvas>
    
    <script>
        // Canvasの取得
        const canvas = document.getElementById("gameCanvas");
        const ctx = canvas.getContext("2d");
        
        // 大招き猫の初期位置
        const cat = {
            x: canvas.width / 2,
            y: canvas.height / 2,
            size: 50
        };
        
        // お金の配列
        let coins = [];
        
        // 竜巻の初期位置
        let tornado = {
            x: 0,
            y: 0,
            radius: 100,
            speed: 2
        };
        
        // ゲームループ
        function gameLoop() {
            update();
            draw();
            requestAnimationFrame(gameLoop);
        }
        
        // ゲームの状態更新
        function update() {
            // 大招き猫の移動
            if (touchX != null && touchY != null) {
                cat.x = touchX;
                cat.y = touchY;
            }
            
            // お金の生成
            if (Math.random() < 0.1) {
                coins.push({
                    x: Math.random() * canvas.width,
                    y: -20,
                    size: 20,
                    speed: Math.random() * 2 + 1
                });
            }
            
            // お金の落下
            coins = coins.filter(coin => {
                coin.y += coin.speed;
                return coin.y <= canvas.height;
            });
            
            // お金と大招き猫の衝突判定
            coins = coins.filter(coin => {
                const dx = coin.x - cat.x;
                const dy = coin.y - cat.y;
                const distance = Math.sqrt(dx * dx + dy * dy);
                return distance > coin.size + cat.size;
            });
            
            // 竜巻の移動
            tornado.x += tornado.speed;
            if (tornado.x > canvas.width) {
                tornado.x = -tornado.radius;
                tornado.y = Math.random() * canvas.height;
            }
        }
        
        // ゲームの描画
        function draw() {
            // Canvasのクリア
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            
            // 竜巻の描画
            ctx.beginPath();
            ctx.arc(tornado.x, tornado.y, tornado.radius, 0, Math.PI * 2);
            ctx.fillStyle = "gray";
            ctx.fill();
            
            // 大招き猫の描画
            ctx.font = "48px serif";
            ctx.fillText("🐱", cat.x - cat.size / 2, cat.y + cat.size / 2);
            
            // お金の描画
            coins.forEach(coin => {
                ctx.font = "24px serif";
                ctx.fillText("💰", coin.x - coin.size / 2, coin.y + coin.size / 2);
            });
        }
        
        // タッチの座標
        let touchX, touchY;
        
        // タッチされた位置の取得
        canvas.addEventListener("touchstart", function(e) {
            const rect = e.target.getBoundingClientRect();
            touchX = e.touches[0].clientX - rect.left;
            touchY = e.touches[0].clientY - rect.top;
        });
        
        // タッチ位置の更新
        canvas.addEventListener("touchmove", function(e) {
            const rect = e.target.getBoundingClientRect();
            touchX = e.touches[0].clientX - rect.left;
            touchY = e.touches[0].clientY - rect.top;
        });
        
        // タッチの終了
        canvas.addEventListener("touchend", function(e) {
            touchX = null;
            touchY = null;
        });
        
        // ゲーム開始
        gameLoop();
    </script>
</body>
</html>
```

ただし、上記のコードは一例です。ゲーム性やデザインをより高度にするためには、さらに機能や要素を追加する必要があるかもしれません。