Не отцепляется от первой точки хотя циклом прохожу.
<!DOCTYPE html>
<html>
<head>
<title>Game</title>
</head>
<body>
<canvas id = "canvas" width = "320" height = "320"></canvas>
<style type="text/css">
#canvas{
border:1px solid black;
}
</style>
<script type="text/javascript">
document.getElementById("canvas");
var ctx = canvas.getContext("2d");
var x = 0,y = 0,hx = 0,hy = 0,plus1 = 1000000000,plus2 = 0;
n = [];
n.push({x:0,y:0});
n.push({x:100,y:100});
document.addEventListener("mousemove",function(e){
x = e.pageX;
y = e.pageY;
});
function game(){
ctx.clearRect(0,0,320,320);
for(i in n){
ctx.fillStyle = "black";
ctx.fillRect(n[i].x,n[i].y,10,10);
for(j = 0;j < n.length;j++){
plus2 = Math.sqrt(Math.pow(n[j].x - x)+Math.pow(n[j].y - y));
if(plus2 < plus1){
plus1 = plus2;
hx = n[j].x;
hy = n[j].y;
}
}
ctx.strokeStyle = "red";
ctx.beginPath();
ctx.moveTo(x,y);
ctx.lineTo(hx,hy);
ctx.stroke();
ctx.closePath();
}
}
setInterval(game,20);
</script>
</body>
</html>