我的canvas画星空的问题出现在哪里？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<canvas id="Canvas" style="border:1px solid #000000;">
</canvas>
</body>
<script>
window.onload = function(){
var canvas = document.getElementById('Canvas');
canvas.width=800;
canvas.height=800;
var ctx = canvas.getContext('2d');
ctx.rect(0,0,800,800);
ctx.fillStyle='#000';
ctx.fill();
ctx.stroke();
for(var i=0;i<200;i++){
var r=Math.random()*10+10;
var x=Math.random()*800-r;
var y=Math.random()*800;
var a=Math.random()*360;
drawStar(ctx,x,y,r,a);
}
}
function drawStar(ctx,x,y,r,rot){
ctx.save();
ctx.translate(x,y);
ctx.rotate(rot/180*Math.PI)
starPath(ctx);
ctx.fillStyle='#fb3';
ctx.strokeStyle='#fd5';
ctx.lineWidth=3;
ctx.lineJoin='round';
ctx.fill();
ctx.stroke();
ctx.restore();
}
function starPath(ctx){
ctx.beginPath();
for(var i=0 ; i<5 ; i++){
ctx.lineTo(Math.cos((18+i*72)/180*Math.PI*20),
-Math.sin((18+i*72)/180*Math.PI)*20);
ctx.lineTo(Math.cos((54+i*72)/180*Math.PI)*0.5*20,
-Math.sin((54+i*72)/180*Math.PI)*0.5*20)
}
ctx.closePath();
}
</script>
</html>
