ある点に向かって正方形を回転させる

私はshooter0を文字に向かって回転させようとしています（常に動いています）。私はatan()を使用してそれを角度に変換しようとしましたが、shooter0は回転しません。ある点に向かって正方形を回転させる

var shooter0 = document.getElementById('shooter0'); 
var character = document.getElementById('character'); 
var tracker0 = shooter0.getContext('2d'); 
// The cordinates for the character and shooter0 
var characterLeft = 530; 
var characterTop = 180; 
var shooter0Left = 960; 
var shooter0Top = 470; 

while (characterLeft >= 700){ 
    setInterval(startShooter, 1000); 
} 


function startShooter(){ 
    //Getting all the variable to be able to calculate the angle of the hypotenuse 
    var dX = characterLeft - tracker0Left; 
    var dY = characterTop - tracker0Top; 
    var arcTan = Math.atan(dX/dY)* 180/Math.PI; 

    var cx = shooter0.width/2; 
    var cy = shooter0.height/2; 


    tracker0.save(); 
    tracker0.translate(cx, cy); // pivot point 
    //rotating the square towards the character 
    tracker0.rotate(arcTan * Math.PI/180); 
    //Drawing the square 
    tracker0.fillRect(400, 300, 100, 100); 
    tracker0.restore(); 
}

HTML：

<canvas id="character" height="50px;" width="50px;"></canvas> 
<canvas id="shooter0" height="100px;" width="100px;"></canvas>

とCSS：

#character{ 
    position: absolute; 
    top: 180px; 
    left: 530px; 
    border: 3px solid black; 
    background-color: orange; 
} 
#shooter0{ 
    position: absolute; 
    left: 960px; 
    top: 470px; 
    border: 2px solid black; 
    background-color: #B40404; 
}

申し訳ありませんが、コードはかなり厄介見つけた場合。あなたがそれを見つけたら、私のコードをすべて手に入れたバイブルです。 https://jsfiddle.net/Snubben/tc0j4psz/3/ JQueryを使用しないでください。

出典

2016-04-07 Johan Karlsson