1

我的画布中间有一个图像,我希望能够将它旋转到我的鼠标在画布上的位置。

我的鼠标位置有变量,我已经将我的图像放在一个矩阵中,所以它目前在中心以给定的值完美地旋转,现在我只需要将两者连接起来。

var characterRotation = 0;

function characterController(){

    ctxMain.clearRect(0, 0, gameWidth, gameHeight);

    var charWidth = 65;
    var charHeight = 85;

    var srcX = 0;
    var srcY = 619;
    var drawX = gameWidth/2 - charWidth/2;
    var drawY = gameHeight/2 - charHeight/2;


    ctxMain.setTransform(1, 0, 0, 1, drawX, drawY);
    ctxMain.rotate(characterRotation * Math.PI/180);

    characterRotation = mouseX*2 / mouseY*2; // ?? this is what needs to roate my character

    ctxMain.drawImage(imgSprite, srcX, srcY, charWidth, charHeight, -charWidth/2, -charHeight/2, charWidth, charHeight);


}
4

1 回答 1

1

从 trig,您正在寻找的角度将是

sin( rotation ) = y / (x^2 + y^2)  # opposite/adjacent

但首先你需要确保你的坐标是居中的,所以从 mouseX 和 mouseY 中减去游戏宽度的一半,然后使用上面得到

rotation = Math.asin( y / (x*x + y*y)
于 2013-01-22T00:03:10.400 回答