javascript - 如何在游戏中自动移动我的车

Question

我正在用 html 5 和 canvas 开发一款游戏，并且是游戏开发的新手。现在我开发了一款游戏，其中汽车和怪物很少，我可以通过以下代码控制汽车:

update(){
        if (keys.ArrowUp) { // Player holding up
            this.y -= this.speed * frameTime;
            this.dir = Math.PI * 0; // set direction
        }
        if (keys.ArrowDown) { // Player holding down
            this.y += this.speed * frameTime;
            this.dir = Math.PI * 1; // set direction
          }
          if (keys.ArrowLeft) { // Player holding left
            this.x -= this.speed * frameTime;
            this.dir = Math.PI * 1.5; // set direction
        }
        if (keys.ArrowRight) { // Player holding right
            this.x += this.speed * frameTime;
            this.dir = Math.PI * 0.5; // set direction
        }        
        if(Math.sign(this.speed) === -1){ // filp directio of second car
            this.dir += Math.PI; // set direction
        }

        monsters.array.forEach(monster => {
            if(monster.isTouching(this)){
                monster.reset();
                monstersCaught += 1;
            }
        });
        if (this.x >= canvas.width || this.y >= canvas.height || this. y < 0 || this.x < 0) {
            this.reset();
        } 
    }

但现在我想让汽车朝不同的方向自行移动。我不想实现任何路由路径或任何 AI。我只是想让汽车自己朝不同的方向移动。例如，直线移动 3 秒，然后向右移动 2 秒，向下移动 3 秒，依此类推。这是我的工作 pen .

感谢任何帮助。

Answer 1

你快到了!

只需向您的 update() 方法添加一个参数，即可通过编程方式控制您的汽车，而无需使用键盘。让它成为 update(dir)

 if (!dir && keys.ArrowUp) dir = 'up'  // Player holding up
 if (dir === 'up') {
        this.y -= this.speed * frameTime;
        this.dir = Math.PI * 0; // set direction
 }

然后在您的 updateObjects() 中，使用带方向的新更新函数调用您的汽车

heros.array[2].update('left');

现在这辆车将继续向左移动!

自动更改方向怎么样？

您可以保留一个内部值来跟踪汽车朝同一方向行驶了多长时间，以及它正在朝哪个方向行驶。当它遇到你设置的max距离/时间时，让它选择一个新的方向，同时重置跟踪器值!

this.traveled = 0;
this.currentDirection = 'left';
....
this.traveled += distance; // update the tracker 
....
if(this.traveled > 1000) { // wow we already traveled 1000px to the left, time to switch direction!
  this.currentDirection = 'right';  
  this.traveled = 0;
}

使用 .update('left') 和 .update('random') 检查更新的笔以获取详细信息:https://codepen.io/xna2/project/editor/XjQnqZ/