Javascript 围绕圆设置动画的文本

所以我有一些代码，当我不添加rotate（）代码时可以工作，但是当我添加它时，它会以我名字的J旋转，更像是一个风车效应。我希望文本围绕一个圆旋转

这是我的

我怎样才能解决这个问题来做我想做的事

代码

---

我想这会有帮助：我试过了，但如果可能的话，我想要更容易理解的东西

function showCircularNameRotating(text,x,y,radius,space,top){
var w = canvas.width,
    h = canvas.height,
    cx = w * 0.5,                 
    cy = h * 0.5,
    angleStep = 0.1,
    txt = 'Justin Esders';

           space = space || 0;
           var numRadsPerLetter = (Math.PI - space * 2) / text.length;
 context.save();
           context.translate(x,y);
           var k = (top) ? 1 : -1; 
           context.rotate(-k * ((Math.PI - numRadsPerLetter) / 2 - space));
           for(var i=0;i<text.length;i++){
              context.save();
              context.rotate(k*i*(numRadsPerLetter));
              context.textAlign = "center";
             context.textBaseline = (!top) ? "top" : "bottom";
             context.fillText(text[i],0,-k*(radius));
              context.restore();
           }
           context.restore();
           (function rotate() {
    context.clearRect(0, 0, canvas.width, canvas.height);     
    context.translate(cx, cy);         
    context.rotate(angleStep);         
    context.translate(-cx, -cy);       
    context.fillText(txt, cx, cy);     
    requestAnimationFrame(rotate); 
})();



        }

showCircularNameRotating("Justin Esders",150,150,75,Math.PI/12);