如何在PaperJS中围绕鼠标旋转点？

Question

我正在使用PaperJS创建一个简单的游戏，而我目前只停留在其中的一小部分。

在游戏中，有一个玩家（只是一个圆圈）有两只手（两个小圆圈）

我希望手总是指向鼠标位置，但我无法弄清楚这样做的等式。

这是我到目前为止的一些代码，我只需要帮助填补空白......

view.onMouseMove = function(event) {
    var mouseX = event.point.x;
    var mouseY = event.point.y;

    var rotation = ???

    playerHands.rotate(rotation, view.center)    
}

这是我想要完成的图表：

Answer 1

非常简单：

function onMouseMove(event) {
    let delta = (event.point - player.position);
    player.rotation = delta.angle+90;
}

这里的想法是你可以使用两个Points来做矢量几何。 更深入的描述在Vector-Geometry Tutorial

中

将鼠标与播放器顶部对齐需要+90偏移量，因为paperjs将x轴视为旋转0°。

我创建了一个有效的example in sketch.paperjs.org

以上player.rotation仅在玩家Group将.applyMatrix设置为false时才有效。 另外我在创建时将玩家组pivot点设置为大圆圈中心：

let player = new Group(circle, handleleft, handleright);
player.applyMatrix = false;
player.pivot = circle.bounds.center;
player.position = position;