Javascript 在PaperJS中，围绕点旋转形状无法正常工作

我正在尝试重新制作小行星游戏。这是Ship对象构造函数的代码示例（我使用的是构造函数而不是对象文本，因为

这个
在文本中引用变量时不能正常工作）：

我省略了关键的处理程序，它是如何操纵船舶的，但基本上它们所做的是调用
this.rot（）
函数，该函数具有不同的角度，具体取决于单击的是右键还是左键

基本上我的问题是，根据这一点，当操纵船舶时，船舶应围绕其
船舶路径位置旋转，这将使该点在船舶围绕其旋转时沿直线移动。相反，这种情况正在发生：


路径中的卷曲部分是我连续操纵飞船几秒钟后出现的。为什么会这样？如果船舶围绕其
位置旋转
，为什么船舶旋转时位置会横向抖动

以下是我在自己的网站上的链接：
我很想把它放在jsbin或codepen上，但尽管我花了好几个小时的时间，却始终无法用javascript实现纸质脚本

。因为出于某种原因，草图不会让箭头键被检测到，所以我给了它一个自动的恒定旋转。效果相同。
原因是path.bounds.center不是三角形的中心。旋转的默认中心是path.bounds.center。看见红色的点是边界。中心，绿色的矩形是边界矩形

您希望围绕三角形中心（技术上称为质心）旋转，该中心可以通过查找从顶点到另一侧中点的路径的2/3点来计算

下面是一些计算三角形质心的代码：

function centroid(triangle) {
    var segments = triangle.segments;
    var vertex = segments[0].point;
    var opposite = segments[1].point - (segments[1].point - segments[2].point) / 2;
    var c = vertex + (opposite - vertex) * 2/3;
    return c;
}

一个更新的显示在计算质心时，当三角形旋转时，中心如何相对于三角形不移动

我已经更新了你的位置，使用质心而不是位置。现在它是直线移动的。
jsbin会很有帮助，我同意，但让paperjs在常规javascript范围内工作是一场噩梦。请放心。我总是在纯JavaScript模式下使用paper—它更容易调试，实际上更快，而且paper-core.js也比paper-full.js小—它不包含JavaScript解析器。我已经看了一段时间了。我试图通过执行
window.onload=function（）{paper.install（window）；paper.setup（'canvas'）；//code}
将paperscript注入全局范围，但它给了我一个错误，即
uncaughttypeerror:无法使用'in'运算符在{x:0，y:0}{x:0，y:-7.5}
中搜索'point。实际上，我并没有完全按照教程所示去做。我只需加载paper-core.js，然后执行
paper.setup（'canvas'）
。我失去的是在积分上使用
+
（和其他操作符）的能力；我必须做
point1.add（point2）
，等等。我必须引用所有以
paper
作为前缀的paper函数和构造函数，所以
paper.Path.Line
等等。我明白了，但这并不能回答我的问题，因为我明确地告诉它围绕某个点旋转。因此，不管它的自然旋转点是什么，我告诉它围绕某个点旋转-即
ship.shipPath.position
-那么旋转怎么可能移动该点的位置呢？因为该点不是三角形的中心。看我答案中的草图-旋转三角形会改变中心位置。您不需要中心位置，因为它不是三角形的中心（事实上，旋转三角形时，边界矩形的大小也会改变）。我将添加一个小代码来计算三角形的质心。如果你在那个位置旋转，它会工作的。啊，对，对，好，我明白了。谢谢@bmacnouton！！谢谢你把它放在我的代码里：）
function centroid(triangle) {
    var segments = triangle.segments;
    var vertex = segments[0].point;
    var opposite = segments[1].point - (segments[1].point - segments[2].point) / 2;
    var c = vertex + (opposite - vertex) * 2/3;
    return c;
}