cRIRIc

canvas.width = 400;
canvas.height = 400;
const ctx = canvas.getContext("2d");
let angolo = 1.5;
const raggio = 50;

animate();

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

    ctx.beginPath();
    ctx.arc(canvas.width / 2, canvas.height / 2, raggio, 0, Math.PI * 2);
    ctx.stroke();

    const x = canvas.width / 2 + raggio * Math.cos(angolo);
    const y = canvas.height / 2 + raggio * Math.sin(angolo);

    ctx.beginPath();
    ctx.moveTo(canvas.width / 2, canvas.height / 2);
    ctx.lineTo(x, y);
    ctx.stroke();

    requestAnimationFrame(animate);
}

canvas.addEventListener("mousemove", (e) => {
    const dx = e.offsetX - canvas.width / 2;
    const dy = e.offsetY - canvas.height / 2;
    angolo = Math.atan2(dy, dx);
});