P5.js | atan()函数

atan()函数是JavaScript数学库中的一个函数，它用于返回一个角度的反正切值。在p5.js中，该函数可被用于计算两个坐标之间的角度。

语法

atan(y,x)

• y：必需。要计算反正切值的值的 Y 坐标。
• x：可选。要计算反正切值的值的 X 坐标。

如果省略 x 值，则默认为 0。

返回值

atan()函数会返回一个数字，表示给定的坐标上点的角度（以弧度为单位）。

示例

let angle = atan(1); // 返回0.7853981633974483
let angle2 = atan(10,10); // 返回0.7853981633974483
let angle3 = atan(10,-10); // 返回2.356194490192345
let angle4 = atan(-10,-10); // 返回-2.356194490192345
let angle5 = atan(-10,10); // 返回-0.7853981633974483

在上面的示例中，我们分别计算了在单位圆上点 $(\frac{1}{\sqrt{2}},\frac{1}{\sqrt{2}})$，$(\frac{10}{\sqrt{200}},\frac{10}{\sqrt{200}})$，$(\frac{10}{\sqrt{200}},-\frac{10}{\sqrt{200}})$，$(-\frac{10}{\sqrt{200}},-\frac{10}{\sqrt{200}})$，$(-\frac{10}{\sqrt{200}},\frac{10}{\sqrt{200}})$ 处的角度。

应用实例

我们可以用 atan() 函数来计算两个坐标之间的角度。例如，在下面的示例中，我们计算出鼠标点击位置相对于画布中心的旋转角度，然后将画布旋转到该角度。

function setup() {
  createCanvas(400, 400);
}

function draw() {
  background(220);
  strokeWeight(20);
  point(width/2, height/2);
  
  let dx = mouseX - width/2;
  let dy = mouseY - height/2;
  let angle = atan(dy, dx);
  
  translate(width/2, height/2);
  rotate(angle);
  line(0, 0, 100, 0);
}

以上代码中，我们用dx和dy表示鼠标点击位置与画布中心的相对位置，然后调用 atan(dy, dx) 函数计算该相对位置的角度。接下来，我们用 translate() 函数将画布移动到中心位置，然后用 rotate() 函数将画布旋转到给定的角度，最后我们用line()函数绘制一条长度为100的线，以此模拟时针的效果。

总结

atan() 函数是JavaScript数学库中的一个函数，它用于计算给定坐标的反正切值，返回结果为角度的弧度值。在p5.js中，我们可以用 atan() 函数来计算两个坐标之间的角度，在实践中有广泛的应用。