面向鼠标的旋转不正确

如何解决面向鼠标的旋转不正确

我正在制作一个简单的 JavaScript 射击游戏，我想在其中将我的主要玩家对象朝向鼠标旋转。当我旋转图像时，这工作正常，但是当我尝试在精灵上执行此操作时，旋转不正确。我在这里附上了代码片段。我想旋转“player1”变量

我正在使用 p5.js 库

我对 JavaScript 还很陌生，所以如果这里有错误请告诉我。

//variables
var player1;
var gun1;
var gun2;


function preload(){
  img = loadImage('rect1.png');
}

function setup(){
    //creating sprites
    player1 = createSprite(200,200,30,30)
    gun = createSprite(player1.x,player1.y-20,5,30)
    gun.shapeColor = "black"
    player1.addImage("player",img)
     player1.scale = 0.2
}

function draw(){
  canvas = createCanvas(displayWidth-20,displayHeight-120);
   background("#32CD32");
   gun.x = player1.x;
   gun.y = player1.y-15;

   // functions to move
   //up
  if(keyDown("up")){
    player1.y = player1.y - 5;
  }
  //down
  if(keyDown("down")){
    player1.y = player1.y + 5;
  }
  //right
  if(keyDown("right")){
    player1.x = player1.x + 5;
  }
  //left
  if(keyDown("left")){
    player1.x = player1.x - 5;
  }
  push()
  angleMode(degrees)
  imageMode(CENTER)
  let a = atan2(mouseY - height / 2,mouseX - width / 2);
       translate(width/2,height/2);
       player1.rotation = a
  pop()
drawSprites();
}