javascript - 以任意 Angular 在移动物体上移动X和Y起点

我正在使用HTML5 Canvas和JavaScript进行游戏。这是一个简单的太空射击游戏，屏幕中央有一个加农炮。我可以将大炮和射击导弹旋转到与大炮方向相同的角度。

但是我有一个问题。对于导弹X和Y的起点，我使用的是大炮的X和Y位置。这看起来很奇怪，因为我想让导弹从加农炮外面发射，就像在角度方向上大概50像素一样。我该如何计算？

通过此代码，我创建了导弹对象：

var dX = Math.cos(this.playerRotationAngle * Math.PI / 180);
var dY = Math.sin(this.playerRotationAngle * Math.PI / 180);
this.activeMissilesArray.push(new Missile(cannon.posX, cannon.posY, dX, dY));

这是从我计算方向的Missile对象的构造函数得出的：

this.directionX = dX * this.speed;
this.directionY = dY * this.speed;

Draw方法：

Draw: function(context)
{
    context.drawImage(this.missile, this.posX-20, this.posY-20);
}

更新方法：

    Update: function()
{
    this.posX += this.directionX;
    this.posY += this.directionY;
}

最佳答案

您是否尝试过使用值为50的速度公式来调整初始位置？

// inside the Missile constructor
// instead of:
//   this.posX = x;
//   this.posY = y;
// do:
this.posX = x + 50 * dX;
this.posY = y + 50 * dY;

关于javascript - 以任意 Angular 在移动物体上移动X和Y起点，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/42033500/