如何确保怪物不在圈内？

Question

我有一个草图 https://codepen.io/korolariya/pen/KXQaJK?editors=0011

 update(){
    if(!this.prey){    
      return;
    }
    let p = this.calcPointInCircle(this.prey.position,this.lake.position,this.lake.radius);
    this.goToPoint(p);
  }

怪物必须在不进入圆圈的情况下追捕受害者。

现在它线性移动到最靠近圆圈渔夫的点。

Answer 1

一种简单的方法是以一定的速度将怪物移向玩家，但强迫怪物的位置保持在圆圈之外。

var currentDist = Math.sqrt(monsterX*monsterX+monsterY*monsterY);
var requiredDist = 50;
if (currentDist<requiredDist)
{
    var f = requiredDist/currentDist;
    monsterX *= f;
    monsterY *= f;
}

不完全正确，因为得到的速度取决于圆圈上玩家的弧度差异，但它看起来很自然：

Live example（用鼠标拖动玩家，怪物会追逐）

Answer 2

使用下面的算法：

1-计算猎物和湖心形成的线的角度，让我们称这个角度 alpha ：

由于alpha的正切等于（yPrey - yLake）/（xPrey - xLake），

var alpha = arctan((yPrey - yLake) / (xPrey - xLake));

2-当以弧度计算alpha时，您可以计算线与坐标x和y的点相交的位置：

var x = lakeRadius * cos(alpha) + xLake;
var y = lakeRadius * sin(alpha) + yLake;