p5.js实现中心物体90°视野内目标变红的问题排查

屏幕中央设置了一个具备90°视野的物体，它每帧绕自身原点旋转。另有一个坐标为随机(x,y)的目标物体，期望当目标处于中心物体的视野范围内时变为红色。尝试了两种计算向量夹角的公式及对应代码，但运行时目标始终无法在视野内正常变红。

尝试的两种夹角计算公式 #

• 反余弦求夹角：

θ = cos⁻¹ [ (a·b) / (|a| |b|) ]

• 反正切求夹角：

θ = atan2(a.y - b.y, a.x - b.x)

对应实现代码 #

方法一（反余弦计算夹角） #

let dotProduct = p5.Vector.dot(target, centerView)
let productMag = target.mag() * centerView.mag();
let result = dotProduct / productMag;
let angleInRad = acos(result);
if (angleInRad > HALF_FOV) {
  // 切换目标颜色为红色
  fill(color(255, 0, 0))
}

方法二（反正切计算夹角） #

let diff = p5.Vector.sub(target, centerView);
let theta = atan2(diff.y, diff.x)
let result = theta
if (result < HALF_FOV && result > HALF_FOV * -1) {
  // 切换目标颜色为红色
  fill(color(255, 0, 0))
}

修复更新 #

感谢@MBo提供的修复方案，目前功能已正常运行。

内容的提问来源于stack exchange，提问作者Ricardinho