嘗試在JavaScript畫布上的鼠標指針方向上旋轉圖像？

Question

這裏是我的代碼：

socket.on('newPositions', function(data) { 
    ctx.clearRect(0, 0, 1500, 1000); 
    for (var i = 0; i < data.length; i++) { 
     var img = document.getElementById("player"); 
     var rotation = -(Math.atan2(data[i].x - event.clientX, data[i].y - event.clientY) * 180/Math.PI); 
     //ctx.drawImage(img, data[i].x, data[i].y, 89, 275); 
     ctx.save(); 
     ctx.translate(data[i].x + 89/2, data[i].y + 275/2); 
     ctx.rotate(rotation); 
     ctx.translate(-data[i].x + 89/2, -data[i].y + 275/2); 
     ctx.drawImage(img, data[i].x, data[i].y); 
     ctx.restore(); 
    } 
    }); 

真的很感激，如果有人可以幫助我找到一個解決方法，因爲我不知道什麼是錯在這一點:)

Answer 1

旋轉方向爲弧度。 請參閱： http://www.html5canvastutorials.com/advanced/html5-canvas-transform-rotate-tutorial/