围绕一个点旋转矩形答案

【问题标题】：Rotate rectangle around a point围绕一个点旋转矩形
【发布时间】：2010-12-16 22:20:41
【问题描述】：

如何让 4 个点围绕指针旋转一定角度以形成一个矩形？我可以围绕一个点旋转一个点，但我不能通过偏移它来制作一个不变形的矩形。

【问题讨论】：

到目前为止你有没有尝试过？一些代码？谢谢
平移您的四个点，以便您将指针视为中心，通过标准旋转矩阵方法进行旋转，然后将这些点平移回来。 Explanation here
如果我知道我会使用它，但我需要一个简单的英语或最好是 JavaScript 的解决方案。

【解决方案1】：

如果您可以围绕一个点旋转一个点，那么旋转一个矩形应该很容易 - 您只需旋转 4 个点。

这是一个围绕原点旋转点的js函数：

function rotate_point(pointX, pointY, originX, originY, angle) {
    angle = angle * Math.PI / 180.0;
    return {
        x: Math.cos(angle) * (pointX-originX) - Math.sin(angle) * (pointY-originY) + originX,
        y: Math.sin(angle) * (pointX-originX) + Math.cos(angle) * (pointY-originY) + originY
    };
}

然后您可以对每个点执行此操作。这是一个例子：http://jsfiddle.net/dahousecat/4TtvU/

换个角度，点击运行看看效果...

【讨论】：

你能解释一下吗？ jsfiddle.net/bjhc34xk/7 这是否与 PI 的近似值有关，或者可能与浮点数学错误有关？
Forked Felix 的小提琴包含一个用于动态输入的滑块，以便于实验 - jsfiddle.net/brichins/0ccdd362
@MaxMastalerz 我相信你现在已经从这个开始了，但你的 Fiddle 可能没有按照你的想法做。您正在计算中间更改端点的 X 坐标，然后从该偏移点而不是中心旋转 Y 坐标。结果是一个很酷的金色螺旋，但我认为你是故意这样做的：jsfiddle.net/brichins/w2rxsbt4