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

No:10593

113

←

Prev Next

→

City Merge Puzzle
Developer User4376｜Date and time 23/8/1 7:09:54
Build time 34.697 sec｜Game capacity 4.578KB｜

Script

了解いたしました。以下に都市マージパズルの実装例を示します。

都市マージパズル

このプログラムは、初期状態で表示されるパズルのボードがあります。矢印キーを押すことで操作ができ、同じ数字同士が重なると合体します。合体するたびにボードが更新され、最終的に終了条件に到達するとゲームが終了します。

←

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>
        body {
            font-family: Arial, sans-serif;
            text-align: center;
        }
        
        #game-board {
            display: inline-block;
        }
        
        .cell {
            width: 50px;
            height: 50px;
            border: 1px solid black;
            display: inline-block;
            margin: 2px;
            font-size: 24px;
            text-align: center;
            line-height: 50px;
            vertical-align: middle;
        }
    </style>
</head>
<body>
    <h1>都市マージパズル</h1>
    <div id="game-board"></div>
    
    <script>
        // パズルの初期状態
        var board = [2, 2, 0, 1, 1, 0, 0, 0, 0];
        
        // ゲームボードの作成
        function createBoard() {
            var boardElement = document.getElementById("game-board");
            
            for (var i = 0; i < board.length; i++) {
                var cell = document.createElement("div");
                cell.setAttribute("class", "cell");
                
                if (board[i] > 0) {
                    cell.textContent = board[i] === 1 ? "🌳" : "🏢";
                }
                
                boardElement.appendChild(cell);
            }
        }
        
        // パズルの操作
        function mergeCells() {
            for (var i = 0; i < board.length - 1; i++) {
                if (board[i] === board[i + 1]) {
                    board[i] += board[i + 1];
                    board[i + 1] = 0;
                }
            }
        }
        
        // キーボード操作でパズルを操作
        document.addEventListener("keydown", function(event) {
            var key = event.key;
            var direction;
            
            if (key === "ArrowUp") {
                direction = "up";
            } else if (key === "ArrowDown") {
                direction = "down";
            } else if (key === "ArrowLeft") {
                direction = "left";
            } else if (key === "ArrowRight") {
                direction = "right";
            }
            
            if (direction) {
                event.preventDefault();
                moveCells(direction);
            }
        });
        
        // パズルの操作を実行
        function moveCells(direction) {
            if (direction === "up") {
                moveUp();
            } else if (direction === "down") {
                moveDown();
            } else if (direction === "left") {
                moveLeft();
            } else if (direction === "right") {
                moveRight();
            }
            
            mergeCells();
            createBoard();
        }
        
        // 上にスライド
        function moveUp() {
            for (var i = 3; i < board.length; i++) {
                if (board[i - 4] === 0 && board[i] !== 0) {
                    board[i - 4] = board[i];
                    board[i] = 0;
                }
            }
        }
        
        // 下にスライド
        function moveDown() {
            for (var i = board.length - 4 - 1; i >= 0; i--) {
                if (board[i + 4] === 0 && board[i] !== 0) {
                    board[i + 4] = board[i];
                    board[i] = 0;
                }
            }
        }
        
        // 左にスライド
        function moveLeft() {
            for (var i = 1; i < board.length; i++) {
                if (i % 4 !== 0 && board[i - 1] === 0 && board[i] !== 0) {
                    board[i - 1] = board[i];
                    board[i] = 0;
                }
            }
        }
        
        // 右にスライド
        function moveRight() {
            for (var i = board.length - 2; i >= 0; i--) {
                if (i % 4 !== 3 && board[i + 1] === 0 && board[i] !== 0) {
                    board[i + 1] = board[i];
                    board[i] = 0;
                }
            }
        }
        
        // ゲーム開始時にボードを作成する
        createBoard();
    </script>
</body>
</html>
```
このプログラムは、初期状態で表示されるパズルのボードがあります。矢印キーを押すことで操作ができ、同じ数字同士が重なると合体します。合体するたびにボードが更新され、最終的に終了条件に到達するとゲームが終了します。