I'm making a game with html canvas ( not WEBGL  ). I have zombies that go to the center of the screen, but for now they are just circles. I want to give them two arms, like the arms players have in surviv.io. I have looked at this question: Moving an object in a circular path. I don't, know what trigonometry to use to calculate the angle. Here is my code: html:

<canvas id='canvas'>
<script src='script.js'>

//script.js
var canvas = document.querySelector('#canvas');
var context = canvas.getContext('2d');
function Enemy(x,y){
this.x = x;
this.y = y;
this.r = 5;
this.color = `hsl(${Math.floor(Math.random() * 360)},50%,50%)`;
this.vx = 0;
this.vy = 0;
this.draw = () => {
this.x += this.vx;
this.y += this.vy;
context.beginPath();
context.fillStyle = this.color;
context.arc(this.x,this.y,this.r,0,Math.PI*2);
context.fill();
}
}
var enemy = new Enemy(0,0);
function loop(){
    requestAnimationFrame(loop);
    context.fillStyle = 'rgba(0,0,0,0.2)';
    context.fillRect(0,0,canvas.width,canvas.height);
    var angle = Math.atan2(canvas.height/2 - enemy.y,canvas.width/2 - enemy.x);
    enemy.vx = Math.cos(angle);
    enemy.vy = Math.sin(angle);
    enemy.draw();
}
requestAnimationFrame(loop)

I want the arms facing the center, and I want them to move when the enemy changes direction. Thanks in advance

I'm making a game with HTML canvas (not WEBGL). I have zombies that go to the center of the screen, but for now they are just circles. I want to give them two arms, like the arms players have in surviv.io. I have looked at this question: Moving an object in a circular path. I don't know what trigonometry to use to calculate the angle. Here is my code:

var canvas = document.querySelector('#canvas');
var context = canvas.getContext('2d');

function Enemy(x, y) {
  this.x = x;
  this.y = y;
  this.r = 5;
  this.color = `hsl(${Math.floor(Math.random() * 360)},50%,50%)`;
  this.vx = 0;
  this.vy = 0;
  this.draw = () => {
    this.x += this.vx;
    this.y += this.vy;
    context.beginPath();
    context.fillStyle = this.color;
    context.arc(this.x, this.y, this.r, 0, Math.PI * 2);
    context.fill();
  }
}
var enemy = new Enemy(0, 0);

function loop() {
  requestAnimationFrame(loop);
  context.fillStyle = 'rgba(0,0,0,0.2)';
  context.fillRect(0, 0, canvas.width, canvas.height);
  var angle = Math.atan2(canvas.height / 2 - enemy.y, canvas.width / 2 - enemy.x);
  enemy.vx = Math.cos(angle);
  enemy.vy = Math.sin(angle);
  enemy.draw();
}
requestAnimationFrame(loop)

<canvas id='canvas'>

I want the arms facing the center, and I want them to move when the enemy changes direction.