Fourmis

<canvas id="antCanvas" width="800" height="800" style="border:1px solid black;"></canvas>

<script>
document.addEventListener("DOMContentLoaded", function() {
    var canvas = document.getElementById("antCanvas");
    var ctx = canvas.getContext("2d");

    var ants = [];
    var food = [];

    function Ant() {
        this.x = 400;
        this.y = 400;
        this.size = 4;
        this.hasFood = false;
    }
    Ant.prototype.move = function() {
        var speed = 1.5;
        this.x += Math.random() * speed * 2 - speed;
        this.y += Math.random() * speed * 2 - speed;

        if (this.x < 0) this.x = 0;
        if (this.y < 0) this.y = 0;
        if (this.x > canvas.width) this.x = canvas.width;
        if (this.y > canvas.height) this.y = canvas.height;

        // Check food pickup
        for (var i = 0; i < food.length; i++) {
            if (!this.hasFood && dist(this, food[i]) < 8) {
                this.hasFood = true;
                food.splice(i,1);
                break;
            }
        }

        // Drop food at queen
        if (this.hasFood && dist(this, {x:400, y:400}) < 10) {
            this.hasFood = false;
            addFood();
        }
    };

    Ant.prototype.draw = function() {
        // Draw body
        ctx.beginPath();
        ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2);
        ctx.fillStyle = this.hasFood ? "orange" : "brown";
        ctx.fill();

        // Draw pattes (small lines left/right)
        ctx.strokeStyle = "black";
        ctx.beginPath();
        ctx.moveTo(this.x - this.size, this.y - this.size);
        ctx.lineTo(this.x - this.size * 1.5, this.y - this.size * 1.5);
        ctx.moveTo(this.x + this.size, this.y - this.size);
        ctx.lineTo(this.x + this.size * 1.5, this.y - this.size * 1.5);
        ctx.moveTo(this.x - this.size, this.y + this.size);
        ctx.lineTo(this.x - this.size * 1.5, this.y + this.size * 1.5);
        ctx.moveTo(this.x + this.size, this.y + this.size);
        ctx.lineTo(this.x + this.size * 1.5, this.y + this.size * 1.5);
        ctx.stroke();
    };

    function dist(a, b) {
        return Math.sqrt((a.x - b.x)*(a.x - b.x) + (a.y - b.y)*(a.y - b.y));
    }

    function addFood() {
        food.push({x: Math.random() * canvas.width, y: Math.random() * canvas.height});
    }

    for (var i = 0; i < 50; i++) ants.push(new Ant());
    for (var i = 0; i < 10; i++) addFood();

    function animate() {
        ctx.fillStyle = "white";
        ctx.fillRect(0, 0, canvas.width, canvas.height);

        // Draw queen
        ctx.beginPath();
        ctx.arc(400, 400, 10, 0, Math.PI * 2);
        ctx.fillStyle = "red";
        ctx.fill();

        // Draw food
        for (var i = 0; i < food.length; i++) {
            ctx.beginPath();
            ctx.arc(food[i].x, food[i].y, 4, 0, Math.PI * 2);
            ctx.fillStyle = "green";
            ctx.fill();
        }

        // Move and draw ants
        for (var i = 0; i < ants.length; i++) {
            ants[i].move();
            ants[i].draw();
        }

        requestAnimationFrame(animate);
    }

    animate();
});
</script>