使用坐标以编程方式旋转形状

Lov*_*all 1 javascript canvas rotation shapes programmatically

如果我有一些使用坐标数组定义的形状,例如

[[-30, -30], [-30, 30], [30, 30], [30, -30]]
Run Code Online (Sandbox Code Playgroud)

和边缘定义使用:

[[0,1],[0,3],[1,2],[2,3]]
Run Code Online (Sandbox Code Playgroud)

做一个正方形。

如何以编程方式告诉形状在javascript中以0-> 359的角度在中心旋转*?

*或者更好的是,是否有允许我选择旋转中心的功能?

** 目前,我已经设法使用以下方法将画布圈成圆形:

var x_rotate = Math.sin(angle * Math.PI /180);
var y_rotate = Math.cos(angle * Math.PI /180);

// for each coordinate
//add x_rotate and y_rotate if coordinate > 0 or subtract if coordinate < 0 
Run Code Online (Sandbox Code Playgroud)

Oli*_* Ni 7

在这里你去,旋转点x, y周围点centerx, centerydegrees度。返回浮点值,如果需要,可以四舍五入。

要旋转形状,请旋转所有点。如果需要,请计算中心,这不会这样做。

Desmos 与xas ayas bcenterxas pcenteryasqdegreesas 链接s

function rotatePoint(x, y, centerx, centery, degrees) {
    var newx = (x - centerx) * Math.cos(degrees * Math.PI / 180) - (y - centery) * Math.sin(degrees * math.PI / 180) + centerx;
    var newy = (x - centerx) * Math.sin(degrees * Math.PI / 180) + (y - centery) * Math.cos(degrees * math.PI / 180) + centery;
    return [newx, newy];
}
Run Code Online (Sandbox Code Playgroud)