迷路の大きさを指定するとそのマスの正方形に迷路を生成し、右手法で解く's game

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

No:26177

←

Prev Next

→

迷路の大きさを指定するとそのマスの正方形に迷路を生成し、右手法で解く
Developer User12908｜Date and time 23/11/27 17:05:24
Build time 59.512 sec｜Game capacity 4.904KB｜

Script

了解しました。以下にプログラムの実装例を示します。

このプログラムでは、指定した大きさの迷路を生成し、右手法で解いています。迷路は`size`で指定した正方形のマスになります。スタート位置とゴール位置はランダムに決定され、スタート位置は`start`クラス、ゴール位置は`goal`クラスで表されます。解かれた経路は`path`クラスで表示されます。上記のコードをHTMLファイルに保存してブラウザで開くと、ゲームが表示されます。迷路の大きさを変更するには、`createMaze`関数の引数に指定したい大きさの数値を渡して呼び出します。例えば、`createMaze(10)`とすると、10x10の迷路が生成されます。

←

Prev　Next

→ 　

Back　

[PR]現在の新着人気ランキング

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

了解しました。以下にプログラムの実装例を示します。

```html
<!DOCTYPE html>
<html>
<head>
    <title>迷路ゲーム</title>
    <style>
        #maze {
            display: grid;
        }

.cell {
            width: 50px;
            height: 50px;
            font-size: 30px;
            text-align: center;
            padding-top: 10px;
            border: 1px solid black;
        }

.start {
            background-color: lightgreen;
        }

.goal {
            background-color: lightblue;
        }

.path {
            background-color: lightyellow;
        }
    </style>
</head>
<body>
    <div id="maze"></div>

// 迷路のマスを生成
            for (let i = 0; i < size; i++) {
                for (let j = 0; j < size; j++) {
                    const cell = document.createElement('div');
                    cell.classList.add('cell');
                    maze.appendChild(cell);
                }
            }

// スタート位置とゴール位置をランダムに決定
            const start = Math.floor(Math.random() * (size * size));
            const goal = Math.floor(Math.random() * (size * size));
            const cells = maze.getElementsByClassName('cell');
            cells[start].classList.add('start');
            cells[goal].classList.add('goal');

// 右手法で迷路を解く
            let current = start;
            let direction = 'up';

while (current !== goal) {
                const next = getNextCell(current, direction, size, cells);

if (next !== -1) {
                    // 着目しているマスを通路に変更
                    cells[current].classList.add('path');

// 移動するマスを次のセルとして更新
                    current = next;
                    direction = getRightHandDirection(direction);
                } else {
                    // 行き止まりの場合、バックトラック
                    direction = getLeftHandDirection(direction);
                }
            }
        }

function getNextCell(current, direction, size, cells) {
            const row = Math.floor(current / size);
            const column = current % size;

switch (direction) {
                case 'up':
                    if (row > 0 && !cells[current - size].classList.contains('path')) {
                        return current - size;
                    }
                    break;
                case 'right':
                    if (column < size - 1 && !cells[current + 1].classList.contains('path')) {
                        return current + 1;
                    }
                    break;
                case 'down':
                    if (row < size - 1 && !cells[current + size].classList.contains('path')) {
                        return current + size;
                    }
                    break;
                case 'left':
                    if (column > 0 && !cells[current - 1].classList.contains('path')) {
                        return current - 1;
                    }
                    break;
            }

return -1;
        }

function getRightHandDirection(direction) {
            switch (direction) {
                case 'up':
                    return 'right';
                case 'right':
                    return 'down';
                case 'down':
                    return 'left';
                case 'left':
                    return 'up';
            }
        }

function getLeftHandDirection(direction) {
            switch (direction) {
                case 'up':
                    return 'left';
                case 'right':
                    return 'up';
                case 'down':
                    return 'right';
                case 'left':
                    return 'down';
            }
        }

createMaze(10);
    </script>
</body>
</html>
```

このプログラムでは、指定した大きさの迷路を生成し、右手法で解いています。迷路は`size`で指定した正方形のマスになります。スタート位置とゴール位置はランダムに決定され、スタート位置は`start`クラス、ゴール位置は`goal`クラスで表されます。解かれた経路は`path`クラスで表示されます。

上記のコードをHTMLファイルに保存してブラウザで開くと、ゲームが表示されます。迷路の大きさを変更するには、`createMaze`関数の引数に指定したい大きさの数値を渡して呼び出します。例えば、`createMaze(10)`とすると、10x10の迷路が生成されます。