Made particles about 3 times more likely to succeed; if AI fails to script them, past excellent particles will be displayed.'s game

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

No:9145

232

←

Prev Next

→

Made particles about 3 times more likely to succee..ALL
Developer User4246｜Date and time 23/7/21 17:42:44
Build time 28.927 sec｜Game capacity 3.077KB｜

Script

了解しました。以下に、スマホで遊べるゲーム「パーティクル」を実装したHTMLファイルの例を示します。

上記のHTMLファイルは、スマホで動作するパーティクル（粒子）のゲームを実装しています。画面をタッチすると、タッチした場所にパーティクルが生成されます。パーティクルは徐々に移動し、サイズが小さくなっていきます。パーティクルのサイズが一定以下になった時点で消滅します。ご確認ください。

←

Prev　Next

→ 　

Back　

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

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

了解しました。以下に、スマホで遊べるゲーム「パーティクル」を実装したHTMLファイルの例を示します。

```html
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>パーティクル</title>
    <style>
        #canvas {
            background-color: black;
            position: absolute;
            top: 0;
            left: 0;
        }
    </style>
</head>
<body>
    <canvas id="canvas"></canvas>

let particles = [];

canvas.width = window.innerWidth;
        canvas.height = window.innerHeight;

const Particle = function (x, y, dx, dy, color) {
            this.x = x;
            this.y = y;
            this.dx = dx;
            this.dy = dy;
            this.color = color;
            this.size = Math.random() * 8 + 1;

this.update = function () {
                this.x += this.dx*7;
                this.y += this.dy*7;
                if (this.size > 0.2) this.size -= 0.19;
            };

this.draw = function () {
                ctx.beginPath();
                ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
                ctx.fillStyle = this.color;
                ctx.fill();
            };
        };

function createParticles(x, y) {
            const colors = ["#FF7F50", "#FFD700", "#FF4500", "#ADFF2F", "#FFC0CB", "#00FFFF"];
            for (let i = 0; i < 16; i++) {
                const dx = Math.random() *2- 0.5*2;
                const dy = Math.random() *2- 0.5*2;
                const color = "#"+Math.random().toString(16).slice(-6);//colors[Math.floor(Math.random() * colors.length)];
                particles.push(new Particle(x, y, dx, dy, color));
            }
        }

function animate() {
            ctx.clearRect(0, 0, canvas.width, canvas.height);

for (let i = 0; i < particles.length; i++) {
                particles[i].update();
                particles[i].draw();
                if (particles[i].size <= 0.2) {
                    particles.splice(i, 1);
                    i--;
                }
            }

requestAnimationFrame(animate);
        }

canvas.addEventListener("touchstart", function (event) {
            const touch = event.touches[0];
            const x = touch.clientX;
            const y = touch.clientY;
            createParticles(x, y);
        });

animate();
    </script>
</body>
</html>
```

上記のHTMLファイルは、スマホで動作するパーティクル（粒子）のゲームを実装しています。画面をタッチすると、タッチした場所にパーティクルが生成されます。パーティクルは徐々に移動し、サイズが小さくなっていきます。パーティクルのサイズが一定以下になった時点で消滅します。

ご確認ください。