A game in which you swipe to dodge a lot of spinning kama attacking you. Sometimes big kama's game

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

No:9563

144

←

Prev Next

→

A game in which you swipe to dodge a lot of spinni..ALL
Developer User4369｜Date and time 23/7/26 2:52:16
Build time 44.526 sec｜Game capacity 5.599KB｜

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">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>カマゲーム</title>
</head>
<body>
    <style>
        #game-container {
            position: relative;
            width: 100vw;
            height: 100vh;
            background-color: #000;
        }

.kama {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 48px;
        }
    </style>

function createKama() {
            const kama = document.createElement('div');
            kama.className = 'kama';
            kama.innerHTML = '🔪';
            gameContainer.appendChild(kama);

const kamaSize = Math.random() * 100 + 50;
            const kamaSpeed = Math.random() * 2 + 1;
            const kamaAngle = Math.random() * 360;

kama.style.fontSize = kamaSize + 'px';
            kama.style.top = Math.random() * (gameContainer.clientHeight - kamaSize) + 'px';
            kama.style.left = Math.random() * (gameContainer.clientWidth - kamaSize) + 'px';
            kama.style.transform = `translate(-50%, -50%) rotate(${kamaAngle}deg)`;

const timer = setInterval(() => {
                const top = parseInt(kama.style.top);
                const left = parseInt(kama.style.left);
                const radians = kamaAngle * (Math.PI / 180);
                const dx = Math.cos(radians) * kamaSpeed;
                const dy = Math.sin(radians) * kamaSpeed;

kama.style.top = top + dy + 'px';
                kama.style.left = left + dx + 'px';

if (collisionDetection(kama)) {
                    clearInterval(timer);
                    gameContainer.removeChild(kama);
                }

if (kamaSize >= 100) {
                    if (collisionDetectionKamaX(kama)) {
                        clearInterval(timer);
                        gameContainer.removeChild(kama);
                    }
                }
            }, 10);
        }

function collisionDetection(kama) {
            const kamaRect = kama.getBoundingClientRect();
            const containerRect = gameContainer.getBoundingClientRect();

if (kamaRect.right < containerRect.left || kamaRect.left > containerRect.right || kamaRect.bottom < containerRect.top || kamaRect.top > containerRect.bottom) {
                return false;
            }

return true;
        }

function collisionDetectionKamaX(kama) {
            const kamaRect = kama.getBoundingClientRect();
            const containerRect = gameContainer.getBoundingClientRect();

if (kamaRect.right < containerRect.left || kamaRect.left > containerRect.right) {
                score += 1;
                updateScore();
                return true;
            }

return false;
        }

function updateScore() {
            scoreElement.innerHTML = `スコア: ${score}`;
        }

function onTouchStart(event) {
            event.preventDefault();
            gameContainer.addEventListener('touchmove', onTouchMove);
        }

function onTouchMove(event) {
            event.preventDefault();
            const touch = event.changedTouches[0];
            const x = touch.clientX;
            const y = touch.clientY;
            const kamas = document.getElementsByClassName('kama');

for (let i = 0; i < kamas.length; i++) {
                const kama = kamas[i];
                const kamaRect = kama.getBoundingClientRect();

if (x >= kamaRect.left && x <= kamaRect.right && y >= kamaRect.top && y <= kamaRect.bottom) {
                    clearInterval(timer);
                    kama.remove();
                    score += 1;
                    updateScore();
                    break;
                }
            }
        }

function onTouchEnd(event) {
            event.preventDefault();
            gameContainer.removeEventListener('touchmove', onTouchMove);
        }

gameContainer.addEventListener('touchstart', onTouchStart);
        gameContainer.addEventListener('touchend', onTouchEnd);

const scoreElement = document.createElement('div');
        scoreElement.innerHTML = `スコア: ${score}`;
        scoreElement.style.position = 'fixed';
        scoreElement.style.top = '10px';
        scoreElement.style.left = '10px';
        scoreElement.style.color = 'white';
        scoreElement.style.fontSize = '24px';
        gameContainer.appendChild(scoreElement);

setInterval(createKama, 1000);
    </script>
</body>
</html>
```