Question

我目前正在开发2D javascript游戏，而且我现在正在做运动机制。我希望玩家能够前进或后退，朝向或远离鼠标，同时还能够进行扫射。

我对鼠标进行了很好的跟踪，但我仍然坚持如何实施扫射。我需要我的播放器沿着动态圆形路径移动，该路径根据玩家离鼠标的距离而改变大小。

例如：如果鼠标是红色X，我想沿绿色圆形路径移动播放器。当然，这条路径将根据玩家离鼠标的距离改变大小。

每当按下移动键时，我都会通过移动来更新玩家位置，所以我真的在寻找一个方程式来将玩家移动到正确的圆形路径中，该路径可以在每秒更新的位置实现＃34 ;某种方式。

我知道对于圆形路径，坐标可以通过以下方式找到：

x = centerX * radius * Math.cos(theta); y = centerY * radius * Math.sin(theta);

但我在实施方面遇到了麻烦。这是我的一些框架，但我担心我尝试过的所有解决方案都没有让我靠近所以我不会发布我已经删除的破碎数学

  Player.prototype.update = function(delta){

       this.playerCenter = [this.x+this.width/2, this.y+this.height/2];

       let dX = (GAME.mouse.position.x - this.playerCenter[0]),
           dY = (GAME.mouse.position.y - this.playerCenter[1]);
           radius = Math.sqrt(dX * dX + dY * dY);


       // Movement Forward
       if(GAME.keyDown[87] && radius >= 50){
         this.x += (dX / radius) * this.movementSpeed * delta;
         this.y += (dY / radius) * this.movementSpeed * delta;
       }

       // Movement Backward
       if(GAME.keyDown[83]){
         this.x -= (dX / radius) * this.movementSpeed * delta;
         this.y -= (dY / radius) * this.movementSpeed * delta;
       }

       // Strafe left
       if(GAME.keyDown[65]){


       }

       // Strafe right
       if(GAME.keyDown[68]){

       }

     }

Answer 1

你几乎有解决方案。

你需要向前向量90度。要旋转矢量90cw，您可以交换x和y，并取消新的x。

EG

dx = ?;  // forward direction
dy = ?;  
// rotate 90 clockwise
dx1 = -dy;
dy1 = dx;

因此，您可以按照以下更新代码

   var dX = (GAME.mouse.position.x - this.playerCenter[0]);
   var dY = (GAME.mouse.position.y - this.playerCenter[1]);
   var  radius = Math.sqrt(dX * dX + dY * dY);
   //normalise       
   if(radius > 0){
       dX = (dX / radius) * this.movementSpeed * delta;
       dY = (dY / radius) * this.movementSpeed * delta;;
   }else{
       dX = dY = 0;  // too close need to set this or you will get NaN propagating through your position variables.
   }



   if(GAME.keyDown[87] && radius >= 50){ // Movement Forward
     this.x += dX;
     this.y += dY;
   }
   if(GAME.keyDown[83]){ // Movement Backward
     this.x -= dX;
     this.y -= dY;
   }
   if(GAME.keyDown[65]){ // Strafe left
      this.x += -dY;     // swap x and y negate new x to rotate vector 90
      this.y += dX; 
   }       
   if(GAME.keyDown[68]){ // Strafe right
      this.x -= -dY;     // swap x and y negate new x to rotate vector 90
      this.y -= dX; 
   }

将画布图像移动到圆形路径

1 个答案: