Javascript заставляет изображение вращаться, чтобы всегда смотреть на курсор мыши? ⇐ Jquery

[Anonymous]

Я пытаюсь заставить стрелку указывать на курсор мыши в JavaScript. Прямо сейчас он просто сильно вращается, вместо того, чтобы указывать на курсор.

Вот фрагмент моего кода: https://jsfiddle.net/pk1w095s/

А вот сам код:

var cv = document.createElement('canvas');
cv.width = 1224;
cv.height = 768;
document.body.appendChild(cv);

var rotA = 0;

var ctx = cv.getContext('2d');

var arrow = new Image();
var cache;
arrow.onload = function() {
cache = this;
ctx.drawImage(arrow, cache.width/2, cache.height/2);
};

arrow.src = 'https://d30y9cdsu7xlg0.cloudfront.net/png/35-200.png';

var cursorX;
var cursorY;
document.onmousemove = function(e) {
cursorX = e.pageX;
cursorY = e.pageY;

ctx.save(); //saves the state of canvas
ctx.clearRect(0, 0, cv.width, cv.height); //clear the canvas
ctx.translate(cache.width, cache.height); //let's translate

var centerX = cache.x + cache.width / 2;
var centerY = cache.y + cache.height / 2;

var angle = Math.atan2(e.pageX - centerX, -(e.pageY - centerY)) * (180 / Math.PI);
ctx.rotate(angle);

ctx.drawImage(arrow, -cache.width / 2, -cache.height / 2, cache.width, cache.height); //draw the image
ctx.restore(); //restore the state of canvas
};


Подробнее здесь: https://stackoverflow.com/questions/401 ... use-cursor