旋转后查找矩形的顶点

Question

所以我承认我真的不知道如何表达这个问题。但一个完整的解释应该有助于阐明一些观点。这是我所知道的。我在 HTML5 Canvas 上绘制了一个矩形。我知道所有 4 个角的点以及宽度和高度。由此我可以计算出中点。我想知道的是，如果我将矩形旋转 n 度，新点将是什么。因此，例如，我想将它从中心点旋转 45 度。四个角的新顶点会是什么？希望这完全解释了我在寻找什么。代码示例，最好是 JavaScript，会很棒。提前致谢。

Answer 1

这个函数计算你需要什么。 `pivot' 是旋转的原点（在您的情况下为矩形的中心）。

function rotatePoint(pivot, point, angle) {
  // Rotate clockwise, angle in radians
  var x = Math.round((Math.cos(angle) * (point[0] - pivot[0])) -
                     (Math.sin(angle) * (point[1] - pivot[1])) +
                     pivot[0]),
      y = Math.round((Math.sin(angle) * (point[0] - pivot[0])) +
                     (Math.cos(angle) * (point[1] - pivot[1])) +
                     pivot[1]);
  return [x, y];
};

将度数转换为弧度：

function degToRad(deg) {
  return deg * Math.PI / 180;
}