按到原点的距离排序坐标 - JavaScript

Question

我在 canvas 上有随机矩形存储在数组中，如下所示：

var rectangles = [
     {x: 10, y: 10},
     {x: 40, y: 50},
     {x: 1, y: 70},
     {x: 80, y: 5},
     {x: 30, y: 60}
];

我现在想根据它们与原点 (0, 0) 的接近程度来标记这些矩形。

我的第一个想法是以不同的模式遍历 x 轴和 y 轴，一个例子是：

// 100 is the width and height of the canvas

for(var x = 0; x < 100; x++){

   for(var y = 0; y < 100; y++){

       // "intersects" loops through the array and returns the matching index or -1 if no match

       if(intersects(rectangles, x, y) > -1){

            console.log('Rectangle' + (intersects(rectangles, x, y) + 1));

       }

   }

}

我遇到的问题是，无论循环模式如何，结果都不如预期。

我的第二个想法是将矩形绘制到原点（见最后一张图片）并按矩形的大小排序。然而，这（并为此计算线距离）也没有产生预期的结果。这可以从绿色矩形看出，它非常接近 X0，但应该是最后一个。

例如，这应该 return 相同的结果：

有谁知道我怎样才能得到正确的标注结果？谢谢！

Answer 1

以下是比较坐标与原点的距离并对其进行排序（从最近到最远）的方法。

var rectangles = [
     {x: 10, y: 10},
     {x: 40, y: 50},
     {x: 1, y: 70},
     {x: 80, y: 5},
     {x: 30, y: 60}
];

const sumOfSquares = (x, y) => {
  return Math.pow(x, 2) + Math.pow(y, 2);
};

rectangles.sort((a, b) => {
  const sumA = sumOfSquares(a.x, a.y);
  const sumB = sumOfSquares(b.x, b.y);
  return sumA - sumB;
});

console.log(rectangles);

按到原点的距离排序坐标 - JavaScript

Sort Coordinates by Distance to Origin Point - JavaScript

javascript

math

geometry