RPG in which you move through 100 squares, pick up strong weapons when they fall, help people when you see them, and choose one of five different dungeons to defeat enemies and the boss at the end of the dungeon.'s game

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

No:8672

121

←

Prev Next

→

RPG in which you move through 100 squares, pick up..ALL
Developer User4226｜Date and time 23/7/17 22:08:51
Build time 100.744 sec｜Game capacity 11.522KB｜

Script

以下は、100マスの中を移動してアイテムを拾い、仲間を助けてダンジョンを攻略するRPGの実装例です。作成したゲームはHTMLファイルとして実装し、JavaScriptを含み、スマートフォン操作に対応しています。

この実装例では、100マスのダンジョンを表すテーブルをHTML上に作成し、JavaScriptを使ってゲームのロジックを実装しています。プレイヤーはスワイプ操作で上下左右に移動し、アイテムを拾ったり仲間を勧誘したりしながらダンジョンを攻略します。最終的にボスとの戦闘に勝利することでゲームクリアとなります。

←

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>RPG Game</title>
    <style>
        td {
            width: 50px;
            height: 50px;
            text-align: center;
            border: 1px solid #000;
        }
    </style>
</head>
<body>
    <table>
        <tbody id="board"></tbody>
    </table>

// プレイヤーデータ
        const player = {
            level: 1,
            weapon: "木の剣",
            health: 100,
            maxHealth: 100,
            attackPower: 10,
            defensePower: 5
        };

// 仲間のデータ
        const companionsData = [
            { name: "戦士", attackPower: 15, defensePower: 10 },
            { name: "魔法使い", attackPower: 10, defensePower: 5 },
            { name: "僧侶", attackPower: 8, defensePower: 8 }
        ];
        let companions = [];

// ボスのデータ
        const bossData = { health: 200, attackPower: 20 };

// ゲームの状態を管理する変数（0: ゲーム中, 1: ゲームクリア, 2: ゲームオーバー）
        let gameState = 0;

// ゲームの初期化
        function initializeGame() {
            // プレイヤーを初期位置に配置
            dungeonData[playerPosition.y][playerPosition.x] = 1;
            updateBoard();

// 必要に応じて初期アイテムを配置
            randomlyPlaceItem();
        }

// ボードを更新する
        function updateBoard() {
            const board = document.getElementById("board");
            board.innerHTML = "";

for (let y = 0; y < dungeonData.length; y++) {
                const row = document.createElement("tr");
                for (let x = 0; x < dungeonData[y].length; x++) {
                    const cell = document.createElement("td");
                    if (dungeonData[y][x] === 0) {
                        cell.textContent = "　";
                    } else if (dungeonData[y][x] === 1) {
                        cell.textContent = "Ｐ";
                    } else if (dungeonData[y][x] === 2) {
                        cell.textContent = "＊";
                    } else if (dungeonData[y][x] === 3) {
                        cell.textContent = "＠";
                    }
                    row.appendChild(cell);
                }
                board.appendChild(row);
            }
        }

// ランダムにアイテムを配置する
        function randomlyPlaceItem() {
            const emptyCells = [];
            for (let y = 0; y < dungeonData.length; y++) {
                for (let x = 0; x < dungeonData[y].length; x++) {
                    if (dungeonData[y][x] === 0) {
                        emptyCells.push({ x, y });
                    }
                }
            }

const randomIndex = Math.floor(Math.random() * emptyCells.length);
            const randomCell = emptyCells[randomIndex];
            dungeonData[randomCell.y][randomCell.x] = 2;
        }

// ランダムに仲間を出現させる
        function randomlySpawnCompanion() {
            const emptyCells = [];
            for (let y = 0; y < dungeonData.length; y++) {
                for (let x = 0; x < dungeonData[y].length; x++) {
                    if (dungeonData[y][x] === 0) {
                        emptyCells.push({ x, y });
                    }
                }
            }

const randomIndex = Math.floor(Math.random() * emptyCells.length);
            const randomCell = emptyCells[randomIndex];
            dungeonData[randomCell.y][randomCell.x] = 3;
        }

// プレイヤーの移動処理
        function movePlayer(direction) {
            if (gameState === 0) {
                let newX = playerPosition.x;
                let newY = playerPosition.y;

if (direction === "up" && playerPosition.y > 0) {
                    newY -= 1;
                } else if (direction === "down" && playerPosition.y < 9) {
                    newY += 1;
                } else if (direction === "left" && playerPosition.x > 0) {
                    newX -= 1;
                } else if (direction === "right" && playerPosition.x < 9) {
                    newX += 1;
                }

if (newX !== playerPosition.x || newY !== playerPosition.y) {
                    const cellValue = dungeonData[newY][newX];
                    if (cellValue === 0) {
                        dungeonData[playerPosition.y][playerPosition.x] = 0;
                        dungeonData[newY][newX] = 1;
                        playerPosition.x = newX;
                        playerPosition.y = newY;
                    } else if (cellValue === 2) {
                        dungeonData[playerPosition.y][playerPosition.x] = 0;
                        dungeonData[newY][newX] = 1;
                        playerPosition.x = newX;
                        playerPosition.y = newY;
                        acquireItem();
                    } else if (cellValue === 3) {
                        dungeonData[playerPosition.y][playerPosition.x] = 0;
                        dungeonData[newY][newX] = 1;
                        playerPosition.x = newX;
                        playerPosition.y = newY;
                        recruitCompanion();
                    }
                    updateBoard();
                }

if (gameState === 0) {
                    performEnemyActions();
                }
            }
        }

// アイテムを入手する処理
        function acquireItem() {
            const randomNumber = Math.floor(Math.random() * 10);
            if (randomNumber < 6) {
                player.level += 1;
                player.attackPower += 10;
                player.defensePower += 5;
                alert("レベルアップ！攻撃力と防御力がアップしました！");
            } else {
                player.weapon = "鉄の剣";
                player.attackPower += 20;
                player.defensePower += 10;
                alert("新しい武器「鉄の剣」を手に入れました！攻撃力と防御力が大幅にアップしました！");
            }
        }

// 仲間を勧誘する処理
        function recruitCompanion() {
            if (companions.length < 3) {
                const randomNumber = Math.floor(Math.random() * companionsData.length);
                const newCompanion = companionsData[randomNumber];
                companions.push(newCompanion);
                alert(`新しい仲間「${newCompanion.name}」を獲得しました！`);
            } else {
                alert("仲間の上限に達しているので新たな仲間を獲得できません。");
            }
        }

// 敵の攻撃処理
        function performEnemyActions() {
            const randomNumber = Math.floor(Math.random() * companions.length);
            const companion = companions[randomNumber];
            const enemyAttackPower = Math.floor(Math.random() * 10) + 10; // 敵の攻撃力は10～20の乱数で決定

if (enemyAttackPower > player.defensePower) {
                const damage = enemyAttackPower - player.defensePower;
                player.health -= damage;
            }

if (player.health <= 0) {
                gameState = 2;
                alert("ゲームオーバー！プレイヤーが倒れました。");
            }

updateBoard();
        }

// ボス戦を開始する
        function startBossFight() {
            const bossAttackPower = bossData.attackPower;

while (player.health > 0 && bossData.health > 0) {
                if (player.attackPower > bossData.defensePower) {
                    const playerDamage = player.attackPower - bossData.defensePower;
                    bossData.health -= playerDamage;
                }

if (bossData.health <= 0) {
                    gameState = 1;
                    alert("ゲームクリア！ボスを倒しました。");
                    return;
                }

if (bossAttackPower > player.defensePower) {
                    const bossDamage = bossAttackPower - player.defensePower;
                    player.health -= bossDamage;
                }

if (player.health <= 0) {
                    gameState = 2;
                    alert("ゲームオーバー！プレイヤーが倒れました。");
                    return;
                }
            }
        }

// タッチイベントを設定
        function setupTouchEvent() {
            const board = document.getElementById("board");
            board.addEventListener("touchstart", handleTouchStart);
            board.addEventListener("touchmove", handleTouchMove);
            board.addEventListener("touchend", handleTouchEnd);
        }

let touchStartX, touchStartY;
        function handleTouchStart(event) {
            touchStartX = event.changedTouches[0].clientX;
            touchStartY = event.changedTouches[0].clientY;
        }

function handleTouchMove(event) {
            event.preventDefault();
        }

function handleTouchEnd(event) {
            const touchEndX = event.changedTouches[0].clientX;
            const touchEndY = event.changedTouches[0].clientY;
            const dx = touchEndX - touchStartX;
            const dy = touchEndY - touchStartY;

if (Math.abs(dx) > Math.abs(dy)) {
                // 横方向の移動が大きい場合、左右方向と判定
                if (dx > 0) {
                    movePlayer("right");
                } else {
                    movePlayer("left");
                }
            } else {
                // 縦方向の移動が大きい場合、上下方向と判定
                if (dy > 0) {
                    movePlayer("down");
                } else {
                    movePlayer("up");
                }
            }
        }

// ゲームを開始する
        initializeGame();
        setupTouchEvent();
    </script>
</body>
</html>
```