2D shooter game with alto of weapons with a cartoon look's game

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

No:23200

←

Prev Next

→

2D shooter game with alto of weapons with a cartoo..ALL
Developer User10738｜Date and time 23/10/29 1:03:52
Build time 96.058 sec｜Game capacity 5.253KB｜

Script

Sure! Here's an example of a simple 2D shooter game implemented as a single HTML file, using JavaScript and enclosed in script tags. The game has a cartoonish look and includes multiple weapons for the player to use. To play the game, you can tap or click on the screen to shoot at the targets.

This is just a basic implementation to get you started. Feel free to modify and expand upon it as per your requirements. You can add more weapons, levels, power-ups, and customize the visuals as per your game design preferences.

←

Prev　Next

→ 　

Back　

[PR]現在の売れ筋グッズランキング

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

```html
<!DOCTYPE html>
<html>
<head>
    <title>2D Shooter Game</title>
    <style>
        #gameCanvas {
            background-color: #f0f0f0;
            cursor: crosshair;
        }
    </style>
</head>
<body>
    <canvas id="gameCanvas" width="800" height="600"></canvas>

// Player variables
        let playerX = canvas.width / 2;
        let playerY = canvas.height / 2;

// Bullet variables
        let bullets = [];

// Target variables
        let targets = [];

// Weapon variables
        let currentWeapon = 'pistol'; // Starting weapon
        let weapons = {
            pistol: {
                color: 'black',
                fireRate: 500, // Fire rate in milliseconds
                damage: 1
            },
            shotgun: {
                color: 'green',
                fireRate: 1000,
                damage: 5
            },
            machineGun: {
                color: 'blue',
                fireRate: 200,
                damage: 2
            }
        };

// Event listeners to handle player movement and shooting
        canvas.addEventListener('mousemove', handleMouseMove);
        canvas.addEventListener('click', shootBullet);

// Game Loop
        function gameLoop() {
            clearCanvas();
            drawPlayer();
            moveBullets();
            drawBullets();
            createTargets();
            drawTargets();
            detectCollisions();
            requestAnimationFrame(gameLoop);
        }

// Function to clear the canvas
        function clearCanvas() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);
        }

// Function to draw the player
        function drawPlayer() {
            ctx.fillStyle = 'red';
            ctx.fillRect(playerX - playerSize / 2, playerY - playerSize / 2, playerSize, playerSize);
        }

// Function to handle player movement
        function handleMouseMove(event) {
            playerX = event.clientX - canvas.offsetLeft;
            playerY = event.clientY - canvas.offsetTop;
        }

// Function to shoot a bullet
        function shootBullet() {
            const bullet = {
                x: playerX,
                y: playerY,
                dx: event.clientX - canvas.offsetLeft - playerX,
                dy: event.clientY - canvas.offsetTop - playerY,
                weapon: currentWeapon
            };
            bullets.push(bullet);
        }

// Function to move bullets
        function moveBullets() {
            for (let i = 0; i < bullets.length; i++) {
                bullets[i].x += bullets[i].dx / 10;
                bullets[i].y += bullets[i].dy / 10;
            }
        }

// Function to draw bullets
        function drawBullets() {
            for (let i = 0; i < bullets.length; i++) {
                ctx.fillStyle = weapons[bullets[i].weapon].color;
                ctx.beginPath();
                ctx.arc(bullets[i].x, bullets[i].y, bulletSize, 0, 2 * Math.PI);
                ctx.fill();
            }
        }

// Function to create targets
        function createTargets() {
            if (Math.random() < 0.01) {
                const target = {
                    x: Math.random() * canvas.width,
                    y: Math.random() * canvas.height
                };
                targets.push(target);
            }
        }

// Function to draw targets
        function drawTargets() {
            for (let i = 0; i < targets.length; i++) {
                ctx.fillStyle = 'yellow';
                ctx.beginPath();
                ctx.arc(targets[i].x, targets[i].y, targetRadius, 0, 2 * Math.PI);
                ctx.fill();
            }
        }

// Function to check for bullet-target collisions
        function detectCollisions() {
            for (let i = 0; i < bullets.length; i++) {
                for (let j = 0; j < targets.length; j++) {
                    const dx = bullets[i].x - targets[j].x;
                    const dy = bullets[i].y - targets[j].y;
                    const distance = Math.sqrt(dx * dx + dy * dy);
                    if (distance < targetRadius + bulletSize) {
                        targets.splice(j, 1);
                        bullets.splice(i, 1);
                        break;
                    }
                }
            }
        }

// Start the game loop
        gameLoop();
    </script>
</body>
</html>
```