javascript - 以顺序方式计算圆坐标

Question

我需要一个接一个地获得给定圆的所有点坐标，这样我就可以通过从一个点跳到下一个点来使对象绕圈。我尝试了中点圆算法，但我找到的版本是用来绘制的，坐标不是连续的。它们同时为 8 个象限生产，并在其上以相反的方向生产。如果至少它们在同一方向，我可以为每个象限制作一个单独的数组，并在最后将它们附加到另一个。这是我现在拥有的 JavaScript 改编代码:

  function calcCircle(centerCoordinates, radius) {
    var coordinatesArray = new Array();
    // Translate coordinates
    var x0 = centerCoordinates.left;
    var y0 = centerCoordinates.top;
    // Define variables
    var f = 1 - radius;
    var ddFx = 1;
    var ddFy = -radius << 1;
    var x = 0;
    var y = radius;
    coordinatesArray.push(new Coordinates(x0, y0 + radius));
    coordinatesArray.push(new Coordinates(x0, y0 - radius));
    coordinatesArray.push(new Coordinates(x0 + radius, y0));
    coordinatesArray.push(new Coordinates(x0 - radius, y0));
    // Main loop
    while (x < y) {
      if (f >= 0) {
        y--;
        ddFy += 2;
        f += ddFy;
      }
      x++;
      ddFx += 2;
      f += ddFx;
      coordinatesArray.push(new Coordinates(x0 + x, y0 + y));
      coordinatesArray.push(new Coordinates(x0 - x, y0 + y));
      coordinatesArray.push(new Coordinates(x0 + x, y0 - y));
      coordinatesArray.push(new Coordinates(x0 - x, y0 - y));
      coordinatesArray.push(new Coordinates(x0 + y, y0 + x));
      coordinatesArray.push(new Coordinates(x0 - y, y0 + x));
      coordinatesArray.push(new Coordinates(x0 + y, y0 - x));
      coordinatesArray.push(new Coordinates(x0 - y, y0 - x));
    }
    // Return the result
    return coordinatesArray;
  }

我更喜欢一些没有三 Angular 函数的快速算法，但我们不胜感激!

编辑

这是最终的解决方案。谢谢大家!

  function calcCircle(centerCoordinates, radius) {
    var coordinatesArray = new Array();
    var octantArrays =
      {oct1: new Array(), oct2: new Array(), oct3: new Array(), oct4: new Array(),
       oct5: new Array(), oct6: new Array(), oct7: new Array(), oct8: new Array()};
    // Translate coordinates
    var xp = centerCoordinates.left;
    var yp = centerCoordinates.top;
    // Define add coordinates to array
    var setCrd =
      function (targetArray, xC, yC) {
        targetArray.push(new Coordinates(yC, xC));
      };
    // Define variables
    var xoff = 0;
    var yoff = radius;
    var balance = -radius;
    // Main loop
    while (xoff <= yoff) {
      // Quadrant 7 - Reverse
      setCrd(octantArrays.oct7, xp + xoff, yp + yoff);
      // Quadrant 6 - Straight
      setCrd(octantArrays.oct6, xp - xoff, yp + yoff);
      // Quadrant 3 - Reverse
      setCrd(octantArrays.oct3, xp - xoff, yp - yoff);
      // Quadrant 2 - Straight
      setCrd(octantArrays.oct2, xp + xoff, yp - yoff);
      // Avoid duplicates
      if (xoff != yoff) {
        // Quadrant 8 - Straight
        setCrd(octantArrays.oct8, xp + yoff, yp + xoff);
        // Quadrant 5 - Reverse
        setCrd(octantArrays.oct5, xp - yoff, yp + xoff);
        // Quadrant 4 - Straight
        setCrd(octantArrays.oct4, xp - yoff, yp - xoff);
        // Quadrant 1 - Reverse
        setCrd(octantArrays.oct1, xp + yoff, yp - xoff);
      }
      // Some weird stuff
      balance += xoff++ + xoff;
      if (balance >= 0) {
        balance -= --yoff + yoff;
      }
    }
    // Reverse counter clockwise octant arrays
    octantArrays.oct7.reverse();
    octantArrays.oct3.reverse();
    octantArrays.oct5.reverse();
    octantArrays.oct1.reverse();
    // Remove counter clockwise octant arrays last element (avoid duplicates)
    octantArrays.oct7.pop();
    octantArrays.oct3.pop();
    octantArrays.oct5.pop();
    octantArrays.oct1.pop();
    // Append all arrays together
    coordinatesArray =
      octantArrays.oct4.concat(octantArrays.oct3).concat(octantArrays.oct2).concat(octantArrays.oct1).
        concat(octantArrays.oct8).concat(octantArrays.oct7).concat(octantArrays.oct6).concat(octantArrays.oct5);
    // Return the result
    return coordinatesArray;
  }

Answer 1

使用可以尝试以下方法:使用您提供的算法但将您的坐标推送到八个不同的坐标数组。之后你必须反转其中的一半(那些具有(x0 + x，y0-y)，(x0-x，y0 + y)，(x0 + y，y0 + x)，(x0-y，y0-x) ) 然后以正确的顺序附加所有数组。请注意将前四个点添加到正确的数组中。