細胞ゲーム *プレイヤーは『細胞』を操作します。 *画面上には、細胞、栄養、細菌が存在しています。また、画面上部にスコアも表示されています。 *細胞、栄養、細菌はJavaScriptのcanvasによって線画されています。 *細胞は、栄養に触れる事でサイズが大きくなり、スコアが得られます。 *細胞は、細菌に触れる事で、スコアは減りませんが、サイズが一気に小さくなってしまいます。's game

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

No:5194

1296

←

Prev Next

→

細胞ゲーム *プレイヤーは『細胞』を操作します。 *画面上には、細胞、栄養、細菌が存在しています..ALL
Developer もちきなこ｜Date and time 23/6/29 20:09:27
Build time 43.224 sec｜Game capacity 4.854KB｜

Script

細胞ゲームの実装例を以下に示します：

この例では、プレイヤーは青い細胞を操作し、画面上に存在する緑色の栄養に触れることでサイズが大きくなり、スコアが得られます。一方、赤い細菌に触れるとサイズが一気に小さくなります。プレイヤーのサイズが一定の制限を超えないようにすることも設定されています。スマホのタッチ操作に対応しており、画面上部にはスコアが表示されます。

←

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">
    <title>細胞ゲーム</title>
    <style>
        canvas {
            border: 1px solid black;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="500" height="500"></canvas>

// 細胞の描画
        function drawPlayer() {
            ctx.beginPath();
            ctx.arc(player.x, player.y, player.size, 0, 2 * Math.PI);
            ctx.fillStyle = "blue";
            ctx.fill();
        }

// 栄養の描画
        function drawNutrients() {
            ctx.fillStyle = "green";
            for (let i = 0; i < nutrients.length; i++) {
                let nutrient = nutrients[i];
                ctx.fillRect(nutrient.x, nutrient.y, 5, 5);
            }
        }

// 細菌の描画
        function drawBacteria() {
            ctx.fillStyle = "red";
            for (let i = 0; i < bacteria.length; i++) {
                let bacterium = bacteria[i];
                ctx.fillRect(bacterium.x, bacterium.y, 10, 10);
            }
        }

// スコアの描画
        function drawScore() {
            scoreDisplay.textContent = "Score: " + player.score;
        }

// ゲームの更新
        function update() {
            // プレイヤーの移動
            window.addEventListener("touchmove", function(event) {
                let touch = event.touches[0];
                player.x = touch.clientX;
                player.y = touch.clientY;
            });

// 栄養の生成
            if (Math.random() < 0.01) {
                nutrients.push({ x: Math.random() * canvas.width, y: Math.random() * canvas.height });
            }

// 細菌の生成
            if (Math.random() < 0.005) {
                bacteria.push({ x: Math.random() * canvas.width, y: Math.random() * canvas.height });
            }

// プレイヤーと栄養の衝突判定
            for (let i = 0; i < nutrients.length; i++) {
                let nutrient = nutrients[i];
                let dx = nutrient.x - player.x;
                let dy = nutrient.y - player.y;
                let distance = Math.sqrt(dx * dx + dy * dy);

if (distance < player.size) {
                    player.size += 1;
                    player.score += 10;
                    nutrients.splice(i, 1);
                    break;
                }
            }

// プレイヤーと細菌の衝突判定
            for (let i = 0; i < bacteria.length; i++) {
                let bacterium = bacteria[i];
                let dx = bacterium.x - player.x;
                let dy = bacterium.y - player.y;
                let distance = Math.sqrt(dx * dx + dy * dy);

if (distance < (player.size + 5)) {
                    player.size -= 5;
                    bacteria.splice(i, 1);
                    break;
                }
            }

// プレイヤーのサイズ制限
            if (player.size > 100) {
                player.size = 100;
            }

// ゲームの描画
            ctx.clearRect(0, 0, canvas.width, canvas.height);
            drawPlayer();
            drawNutrients();
            drawBacteria();
            drawScore();

requestAnimationFrame(update);
        }

// ゲームの初期化
        function init() {
            nutrients = [];
            bacteria = [];
            player.score = 0;
            player.size = 10;

// スコアのスタイル設定
            scoreDisplay.style.position = "fixed";
            scoreDisplay.style.top = "10px";
            scoreDisplay.style.left = "10px";
            scoreDisplay.style.fontFamily = "Arial";
            scoreDisplay.style.fontSize = "24px";
            scoreDisplay.style.color = "black";

update();
        }

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