是什么导致了这种“;无人机;在特定角度转弯时会抖动

What could be causing this "drone" to be jittery when turning at certain angles?

本文关键字：转弯 抖动 无人机 是什么      更新时间：2023-09-26

http://codepen.io/AlexKM/pen/JGEMjZ

turnTo: function (X, Y) {
    var angleDiff = 0,
        targetA = this.angleToPoint({
            x: X,
            y: Y
        }),
        dronA = this.angle;
    ///   If the angle difference can't be reached in a frame
    if (Math.abs(targetA - dronA) > this.turnSpeed * 1.25) {
        this.workingAngle = true;
        angleDiff = targetA - dronA;
        while (angleDiff < 0)
            angleDiff += 2 * Math.PI;
        while (angleDiff > 2 * Math.PI)
            angleDiff -= 2 * Math.PI;
        if (angleDiff >= Math.PI) {
            this.turningLeft = true;
        } else {
            this.turningRight = true;
        }
    } else ///  if the diff is negligible, reach it to save CPU
        this.angle = targetA;
},

处理实际车削的更新功能片段：

    // apply turning
    if (this.turningLeft) {
        this.angle -= this.turnSpeed;
    }
    else if (this.turningRight) {
        this.angle += this.turnSpeed;
    }

红点-无人机正面
橙色圆点-无人机向左或向右转弯的信号
青色点-无人机正在重新计算角度/进行三角时的信号

该代码确实包含一个帮助它平滑的部分，基本上只需设置鼠标的角度（如果可以在testDrone.turnSpeed变量的一帧内到达）。

大约有一半的时间，它会平稳地转动和工作。另一半，它变得抖动，交替地向左和向右转动，并不断地计算trig。

这可能是什么原因？

不错的脚本。：）

我认为抖动可能是（帧速率（fps）+处理时间）和监视器刷新率之间的差异的函数。我这么说是因为有时它看起来很平滑，有时有点粗糙，而且就鼠标的位置/移动而言，似乎没有特定的模式。

你有没有想过使用requestAnimationFrame()而不是setTimeout()？请参阅此处的MDN，其中说明。。。

这将请求在浏览器执行下一次重新绘制之前调用动画函数。回调次数通常为每秒60次，但根据W3C的建议，通常会与大多数web浏览器中的显示刷新率相匹配

请参阅markE对此StackOverflow问题的回应，该问题涉及将requestAnimationFrame调用限制到特定帧速率。

希望能有所帮助。：）

修复的方法是确保角度实际重置为特定值，而不是在超过特定限制时按Pi递增/递减。这是我的设计失误，因为抖动消除对"高于"Pi或"低于"Pi 的角度不起作用

这是为了进入更新功能：

update: function (ctx) {
    // reset angles below and above 2pi
    while (this.angle > Math.PI)
        this.angle = -Math.PI;
    while (this.angle < -Math.PI)
        this.angle = Math.PI;
相关文章：