javascript - Canvas 游戏 : Maximum steering angle in n seconds

Question

所以我不知道标题是否让我的问题达到一定程度，而且我的英语可能无法很好地完全解释它。幸运的是，代码可以:D

所以，我正在开发一款小型多人游戏，你可以用键盘操纵一条线(速度例如为每秒 300 像素，你可以用按键调整它的移动 Angular )。

每个玩家都画一条无限的线，当你的“蛇”..不知道你会怎么调用它..碰到黑色(背景颜色)以外的东西时，你就死了。活得最长的玩家获胜。

您可以收集元素，其中一个元素是《街头霸王》中的“Hadouken”，它瞄准最近的玩家并尝试击中他(此处相同:给定速度和 Angular )。

每帧都会计算“Hadouken” Angular 。 goalTo 是玩家:

if (hadouken.aimTo)
{
    var dx = hadouken.aimTo.x - hadouken.x;
    var dy = hadouken.aimTo.y - hadouken.y;
    var dist = Math.sqrt(Math.pow(dx, 2) + Math.pow(dy, 2));

    hadouken.rad = Math.atan2(dy, dx);

    if (dist < hadouken.aimTo.radius)
    {
        ...
    }
}

var plusX = hadouken.speed * _.timeFactor * Math.cos(hadouken.rad);
var plusY = hadouken.speed * _.timeFactor * Math.sin(hadouken.rad);

hadouken.x += plusX;
hadouken.y += plusY;

_.rotateDraw(hadouken, hadouken.x - hadoukenWidth / 2, hadouken.y - hadoukenHeight / 2, hadoukenWidth, hadoukenHeight, {rad: hadouken.rad}, function(x, y) {
    _.drawImage(hadoukenImage, x, y, hadoukenWidth, hadoukenHeight);
});

但是这个东西总是有正确的 Angular ，并且如果它在硬编码的 5 秒后没有消失的话，就会到达目标(速度 = targetSpeed * 1.5 ;))。你没有机会用你的线来躲避它。我的曲线太尖锐了。

我的问题是:你能以某种方式将 Angular 增加限制在.. idk .. 每秒30度吗？我确信我可以自己做到这一点，但这会很奇特，而且可能不必要地困难。

我希望这足够清楚，再次为我的英语感到抱歉，我希望得到一些答案:)

Answer 1

而不是

hadouken.rad = Math.atan2(dy, dx);

我会这样编码:

// time_elapsed is time since previous animation state update (in time units)
// angular_speed is max turning speed in radians per time unit

var dest_angle = Math.atan2(dy, dx);

// normalize destination vector dx,dy
var nx = Math.cos(dest_angle);
var ny = Math.sin(dest_angle);

// calc current vector
var cx = Math.cos(hadouken.rad);
var cy = Math.sin(hadouken.rad);

// calc cross product, its sign will tell ya which direction we should turn
var crp = cx*ny - cy*nx;

var ang_ofs = angular_speed * time_elapsed;

if ( crp>0 ) // shoud turn clockwise
    hadouken.rad += ang_ofs;
else
if ( crp<0 )  // shoud turn counter clockwise
    hadouken.rad -= ang_ofs;

// dont let it over-turn
cx = Math.cos(hadouken.rad);
cy = Math.sin(hadouken.rad);
var crp2 = cx*ny - cy*nx;
if (crp*crp2<0) // sign changed!
    hadouken.rad = dest_angle;