Javascript 旋转角速度的仿真

我希望能够模拟身体在一个“旋转木马”上的运动。（向心力、离心力、角速度）。下面是一些示例代码

var rotate=Math.PI/180；
var=1；
函数drawthis（）{
var摩擦=0.5；
setTransform（1,0,0,1,0,0）；
clearRect（0,0，cvs.width，cvs.height）；
上下文翻译（350350）；
上下文。旋转（rotate）；
context.beginPath（）；
弧（1,1,12,0,2*Math.PI，false）；
context.fill（）；
context.beginPath（）；
arc（0,0,150,0，Math.PI*2，false）；
context.lineWidth=6；
stroke（）；
运动=球体旋转-摩擦；
旋转+=运动；
requestAnimationFrame（drawthis）；
}
函数init（）{
cvs=document.getElementById（“画布”）；
context=cvs.getContext（“2d”）；
clearRect（0，0，context.width，context.height）；
context.fillStyle=“#ff0000”；
requestAnimationFrame（drawthis）；
}

转盘上的球 下面，您将看到一个简单的模拟点在一个转动的轮子上滑动。该点表示球的接触点

模拟忽略了球可以滚动或具有质量这一事实

球通过一个简单的摩擦模型滑动，其中摩擦是一个标量值，应用于球速度矢量和球下点的车轮速度之间的差

只涉及一个力。它是与球到车轮中心的矢量相切的力，减去球的运动矢量，然后乘以摩擦系数

有关如何计算的详细信息，请参阅函数

ball.update（）中的注释

笔记

如果球从车轮的死点开始，什么也不会发生


如果这是你想要的球的路径，或者只是球的模拟，我无法训练，所以我将两者都添加了


球离开车轮后复位


车轮标有文字和中心十字，因此可以看到其旋转




const ROTATE=Math.PI/50；
常数轮_尺寸=0.6；
Math.rand=（min，max）=>Math.random（）*（max-min）+min；
Math.randPow=（min，max，p）=>Math.random（）**p*（max-min）+min；
var摩擦=0.35；
const ctx=canvas.getContext（“2d”）；
requestAnimationFrame（主循环）；
ctx.font=“30px arial”；
ctx.textAlign=“中心”；
scrollBy（0，canvas.height/2-canvas.height/2*滚轮大小）；
函数mainLoop（）{
setTransform（1,0,0,1,0,0）；
clearRect（0，0，ctx.canvas.width，ctx.canvas.height）；
wheel.update（）；
更新（轮子，箭头）；
轮图（）；
path.draw（）；
ball.draw（）；
箭头。画（球）；
requestAnimationFrame（主循环）；
}
const path=Object.assign（[]{
画（）{
setTransform（1,0,0,1,0,0）；
ctx.strokeStyle=“#F00”；
ctx.lineWidth=1；
ctx.beginPath（）；
对于（此的常数p）{ctx.lineTo（p.x，p.y）}
ctx.stroke（）；
},
reset（）{this.length=0}，
添加（点）{
这个.push（{x:point.x，y:point.y}）；
如果（this.length>1000）{//防止长线减慢渲染速度
这个shift（）
}
}
});  
常数箭头={
dx:0，dy:0，
抽签（球）{
if（this.dx | | this.dy）{
const dir=Math.atan2（this.dy，this.dx）；
//len从帧1/60秒转换为秒
常数len=Math.hypot（this.dy，this.dx）*60；
常量aXx=数学cos（dir）；
常数aXy=Math.sin（dir）；
setTransform（aXx，aXy，-aXy，aXx，ball.x，ball.y）；
ctx.beginPath（）；
ctx.lineTo（0,0）；
ctx.lineTo（len，0）；
ctx.moveTo（len-4，-2）；
ctx.lineTo（len，0）；
ctx.lineTo（len-4,2）；
ctx.strokeStyle=“#FFF”；
ctx.lineWidth=2；
ctx.stroke（）；
}
}
};
常数球={
x:canvas.width/2+4，
y:canvas.height/2，
dx:0，//增量位置移动向量
dy:0,，
更新（方向盘，箭头）{
//获得距离中心的距离
const dist=Math.hypot（wheel.x-this.x，wheel.y-this.y）；
//零力箭头
arrow.dx=0；
arrow.dy=0；
//检查车轮是否有磨损
if（距离<车轮半径）{
//获取切线向量方向
常量切线=Math.atan2（this.y-wheel.y，this.x-wheel.x）+Math.PI*0.5*Math.sign（wheel.dr）；
//得到向量的切线
//这是距离乘以车轮旋转的弧度。
常数tx=数学cos（切线）*距离*车轮dr；
常数=Math.sin（切线）*距离*wheel.dr；
//通过摩擦力获得球矢量和切线矢量缩放之间的差异
常数fx=arrow.dx=（tx-this.dx）*摩擦力；
常数fy=arrow.dy=（ty-this.dy）*摩擦力；
//添加力向量
该值为0.dx+=fx；
这个.dy+=fy；
}否则，如果（距离>车轮半径*1.7）{//复位球
//为确保球偏离中心，请使用随机极坐标
const dir=Math.rand（0，Math.PI*2）；
const dist=Math.randPow（1,20,2）；//添加偏差以接近中心
this.x=canvas.width/2+Math.cos（dir）*dist；
this.y=canvas.height/2+Math.sin（dir）*dist；
该值为0.dx=0；
T