计算绳索的长度和一个奇怪的结果

Calculating the length of a cord and a bizarre result

我正在尝试计算 p5.js 中 circle/ellipse 范围内的电线长度。
给出的参数是 valuessizevalues 是一个包含 3 个值的简单数组:色调、饱和度和亮度。比较重要的参数是size,也就是形状(圆)的宽和高。
for 循环遍历 size 的长度时,将执行数学运算以通过毕达哥拉斯定理得出绳索长度的一半。 rsize 或半径的一半。 yfor 循环的当前值。 r^2 - |y-r|^2 = x^2 其中x 为线长的一半(绝对值不需要,但或多或​​少只是为了确保和调试)。
但是,每当我在等式中平方 r 时,我都会收到下面的奇怪形状。当我不在等式中平方 r 时,我得到旋转的正方形。背景中的圆圈代表我要显示的当前 HSL。

当我不平方时会发生这种情况r

当我平方 r 时会发生这种情况

这是我当前的代码:

this.draw = function(values, size) {
  //angleMode(DEGREES);
  this.gap = values[2];
  this.r = size / 2;
  this.lCol = map(values[1], 0, 100, 10, 70)

  strokeUniform(this.lCol);
  fillUniform(map(values[2], 0, 100, this.lCol + 20, 240));
  strokeWeight(map(values[0], 0, 360, 0, 10));
  translate(this.r, this.r, 0);

  for (y = 0; y < size; y++) {
    if (y % Math.floor(this.gap / 2) == 0) {
      if (this.r > y) {
        this.len = ((this.r ^ 2 - (Math.abs(this.r - y) ^ 2))) ^ 0.5;
        line(0 - this.len, 0 - (this.r - y), 0 + this.len, 0 - (this.r - y));
      } else {
        this.len = ((this.r ^ 2 - ((y - this.r) ^ 2))) ^ 0.5;
        line(0 - this.len, y - this.r, 0 + this.len, y - this.r);
      }
    }
  }
}

这没有达到您的预期:

r^2

^ 符号是 bitwise XOR operator,它适用于二进制数。例如:

var x = 5; // 0101
var y = 1; // 0001
var z = x ^ y; // 0100
console.log(z); // 4

换句话说,XOR 运算符查看数字的二进制表示中的每个数字,如果只有一个参数是 1,则结果数字为 1。

更多信息在这里:

您可能需要 Math.pow() 功能。可以找到更多信息 here.

更好的是,P5.js 提供了 sq() 功能。可以在 the P5.js reference.

中找到更多信息

同样,寻找 Math.sqrt() 或 P5.js sqrt() 函数而不是使用 ^ 0.5.