Javascript 提高在画布中围绕圆圈移动重角的速度

我是画布新手，我想改变红色矩形在圆圈周围移动的速度，因为当前它移动缓慢（60fps），我也尝试过设置超时，但对我来说不起作用。谁能帮我以更快的速度移动红色矩形

var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
var-cx=30；
var-cy=30；
宽度=10；
高度=2；
var旋转=0；
请求动画帧（动画）；
函数animate（）{
请求动画帧（动画）；
clearRect（0,0，canvas.width，canvas.height）；
ctx.beginPath（）；
ctx.arc（cx，cy，10,0，数学PI*2）；
ctx.closePath（）；
ctx.fill（）；
ctx.lineWidth=5；
ctx.stroke（）；
ctx.save（）；
翻译（cx，cy）；
ctx.旋转（旋转）；
ctx.strokeStyle=“红色”；
ctx.strokeRect（-rectWidth/4+20，-rectHeight/2，rectWidth，rectHeight）；
ctx.restore（）；
旋转+=Math.PI/180；
}

---

在您的

动画

函数中，您有一个角度

旋转

，它被传递给方法

旋转角度越大，速度越快。

下面是矩形以更高速度移动的片段：（注意，我已经更改了

旋转的值

）

var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
var-cx=30；
var-cy=30；
宽度=10；
高度=2；
var旋转=0；
请求动画帧（动画）；
函数animate（）{
请求动画帧（动画）；
clearRect（0,0，canvas.width，canvas.height）；
ctx.beginPath（）；
ctx.arc（cx，cy，10,0，数学PI*2）；
ctx.closePath（）；
ctx.fill（）；
ctx.lineWidth=5；
ctx.stroke（）；
ctx.save（）；
翻译（cx，cy）；
ctx.旋转（旋转）；
ctx.strokeStyle=“红色”；
ctx.strokeRect（-rectWidth/4+20，-rectHeight/2，rectWidth，rectHeight）；
ctx.restore（）；
旋转+=Math.PI/180*15；
}

---

在您的

动画

函数中，您有一个角度

旋转

，它被传递给方法

旋转角度越大，速度越快。

下面是矩形以更高速度移动的片段：（注意，我已经更改了

旋转的值

）

var canvas=document.getElementById（“canvas”）；
var ctx=canvas.getContext（“2d”）；
var-cx=30；
var-cy=30；
宽度=10；
高度=2；
var旋转=0；
请求动画帧（动画）；
函数animate（）{
请求动画帧（动画）；
clearRect（0,0，canvas.width，canvas.height）；
ctx.beginPath（）；
ctx.arc（cx，cy，10,0，数学PI*2）；
ctx.closePath（）；
ctx.fill（）；
ctx.lineWidth=5；
ctx.stroke（）；
ctx.save（）；
翻译（cx，cy）；
ctx.旋转（旋转）；
ctx.strokeStyle=“红色”；
ctx.strokeRect（-rectWidth/4+20，-rectHeight/2，rectWidth，rectHeight）；
ctx.restore（）；
旋转+=Math.PI/180*15；
}

---

用一个因子乘以旋转<代码>旋转+=Math.PI/180*10谢谢Tahir Ahmedmultiply的旋转，也许有一个因素<代码>旋转+=Math.PI/180*10谢谢塔希尔·艾哈迈德