Вращающаяся цифра 8 - оставляя путь на экране через промежутки времени

Question

Мне бы хотелось, чтобы фигура 8, вращающаяся вокруг центральной точки, печатала себя (и оставалась там) вдоль круга на определенных частотах.

Мне нужно увидеть наложение, напечатанное на экране, и нарисовать его рисунок вокруг его орбиты.

requestAnimationFrame(animate);


function animate(){
    requestAnimationFrame(animate);
    ctx.beginPath();
    ctx.arc(cx,cy,10,0,Math.PI*2);
    ctx.closePath();
    ctx.clearRect(0,0,canvas.width,canvas.height);
    ctx.fill();
    ctx.save();
    ctx.translate(cx,cy);
    ctx.rotate(rotation);

    ctx.beginPath();

    for (var t = 0.0; t < 15; t += 0.1){
        console.log(x, y);
        x = Math.sin(t)*20 + 150;
        y = Math.sin(a * t + b)*20 + 150;
        dy = Math.cos(a * t + b) * a;
        ctx.lineTo(x, y);
        if (dy < 0.1 && dy > -0.1)
          ctx.fillRect(x,y,0,0);
        ctx.stroke();
}
    ctx.restore();

    rotation+=Math.PI/50;
}

Я запустил кодовую ручку https://codepen.io/braydendevito/pen/zQEJjz

Я предполагаюдля этого нужен цикл, но я не могу заставить его работать.

Я ценю это.