为什么明明设置了绘制10棵星星，运行之后，出现满画布的星星

源自：4-2 图像变换和状态保存

<!doctype html>

<html>

<head>

<title>无标题文档</title>

window.onload=function(){

var canvas=document.getElementById("canvas");

var context=canvas.getContext("2d");

canvas.width=800;

canvas.height=800;

context.fillStyle="black";

context.fillRect(0,0,canvas.width,canvas.height);

for(i=0;i<10;i++)

{

var r=Math.random()*10+10;

var x=Math.random()*canvas.width;

var y=Math.random()*canvas.height;

var a=Math.random()*360;

draw(context,r,r/2,x,y,a);

}

//rot 旋转角度

function draw(cxt,R,r,x,y,rot){

context.beginPath();

for(i=0;i<5;i++)

{

cxt.lineTo(Math.cos((18+i*72-rot)/180*Math.PI)*R+x,

-Math.sin((18+i*72-rot)/180*Math.PI)*R+y);

cxt.lineTo(Math.cos((54+i*72-rot)/180*Math.PI)*r+x,

-Math.sin((54+i*72-rot)/180*Math.PI)*r+y);

}

cxt.closePath();

cxt.lineWidth=3;

cxt.strokeStyle="#fd5";

cxt.lineJoin="round";

cxt.fillStyle="#fb3";

cxt.fill();

cxt.stroke();

}}

</script>

</head>

<body>

</canvas>

</body>

</html>

提问者：新一代英雄 2015-08-04 16:01