Make a game that’s 3d and has ridged body’s. The main character is a little boy and the atmosphere is a field with flat terrain. Put a joystick on the screen for the player to use to control the character.'s game

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

No:17812

109

←

Prev Next

→

Make a game that’s 3d and has ridged body’s. The m..ALL
Developer User7797｜Date and time 23/9/24 18:27:59
Build time 48.142 sec｜Game capacity 4.932KB｜

Script

Sure! Here's an example of a simple game with a 3D character, ridged bodies, and a joystick control on a flat terrain. Please note that this is a basic implementation using JavaScript and HTML, and it might not work as expected in all devices or browsers. Also, due to the limitations of text-based communication, I can't provide pictograms directly in the answer.

To play the game, you can copy and paste the code into a new HTML file, save it, and then open it in a web browser (preferably on a smartphone or with device emulation enabled in the developer tools). The game features a character that can be moved using a virtual joystick displayed on the screen.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋Kindle本ランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <style>
        #game-container {
            width: 800px;
            height: 400px;
            border: 1px solid black;
            position: relative;
        }

#character {
            width: 50px;
            height: 50px;
            background-color: red;
            position: absolute;
            top: 200px;
            left: 400px;
        }

#joystick {
            width: 100px;
            height: 100px;
            background-color: gray;
            border-radius: 50%;
            position: absolute;
            bottom: 20px;
            left: 20px;
            display: flex;
            justify-content: center;
            align-items: center;
        }

#joystick-indicator {
            width: 30px;
            height: 30px;
            background-color: white;
            border-radius: 50%;
            pointer-events: none; /* prevent joystick from being draggable */
        }
    </style>
</head>
<body>
    <div id="game-container">
        <div id="character"></div>
        <div id="joystick">
            <div id="joystick-indicator"></div>
        </div>
    </div>

// Define game variables
        const characterSpeed = 5;
        let characterPosition = { x: 0, y: 0 };

// Move character based on joystick input
        function moveCharacter(direction) {
            switch (direction) {
                case 'up':
                    characterPosition.y -= characterSpeed;
                    break;
                case 'down':
                    characterPosition.y += characterSpeed;
                    break;
                case 'left':
                    characterPosition.x -= characterSpeed;
                    break;
                case 'right':
                    characterPosition.x += characterSpeed;
                    break;
            }

characterElement.style.transform = `translate(${characterPosition.x}px, ${characterPosition.y}px)`;
        }

// Listen for joystick touch events
        joystickElement.addEventListener('touchstart', handleJoystickTouch);
        joystickElement.addEventListener('touchmove', handleJoystickTouch);
        joystickElement.addEventListener('touchend', resetJoystick);

// Handle joystick touch events
        function handleJoystickTouch(event) {
            event.preventDefault(); // Prevent scrolling on touch
            const touch = event.targetTouches[0];

// Calculate joystick position
            const joystickRect = joystickElement.getBoundingClientRect();
            const joystickCenterX = joystickRect.left + joystickRect.width / 2;
            const joystickCenterY = joystickRect.top + joystickRect.height / 2;
            const joystickX = touch.clientX - joystickCenterX;
            const joystickY = touch.clientY - joystickCenterY;

// Limit joystick movement within its container
            const maxRadius = joystickRect.width / 2 - joystickIndicatorElement.clientWidth / 2;
            const distance = Math.min(Math.sqrt(joystickX ** 2 + joystickY ** 2), maxRadius);

const angle = Math.atan2(joystickY, joystickX);
            const x = Math.cos(angle) * distance;
            const y = Math.sin(angle) * distance;

// Position joystick indicator
            joystickIndicatorElement.style.transform = `translate(${x}px, ${y}px)`;

// Move character based on joystick position
            if (angle > -Math.PI / 4 && angle <= Math.PI / 4) moveCharacter('right');
            else if (angle > Math.PI / 4 && angle <= 3 * Math.PI / 4) moveCharacter('down');
            else if (angle <= -Math.PI / 4 && angle > -3 * Math.PI / 4) moveCharacter('up');
            else moveCharacter('left');
        }

// Reset joystick position
        function resetJoystick() {
            joystickIndicatorElement.style.transform = 'translate(0, 0)';
        }
    </script>
</body>
</html>
```