<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<script>
window.onload = function(){
var canvas = document.getElementById("canvas");
canvas.width = 1000;
canvas.height = 700;
var context = canvas.getContext("2d");
context.fillStyle = "black";
context.fillRect(0 ,0 ,canvas.width,canvas.height);
for(var i = 0 ; i < 200 ;i++){
var r = Math.random() * 10 + 10;
var x = Math.random() * canvas.width;
var y = Math.random() * canvas.height;
var a = Math.random() * 360;
drawStar(context, x, y, r, r/2.0, a);
}
function drawStar(cxt, x, y, outerR, innerR, rot){
for (var i = 0; i < 5; i++){
cxt.lineTo ( Math.cos( (18+i*72-rot) / 180*Math.PI ) * outerR + x,
-Math.sin( (18+i*72-rot)/ 180*Math.PI) * outerR + y);
cxt.lineTo(Math.cos( (54+i*72-rot) / 180*Math.PI) * innerR + x,
-Math.sin( (54+i*72-rot) / 180*Math.PI) * innerR + y);
}
cxt.closePath();
cxt.lineWidth = 3;
cxt.fillStyle = "#fb3";
cxt.strokeStyle = "#fd5";
cxt.fill();
cxt.stroke();
}
}
</script>
</head>
<body>
<canvas id="canvas" style="margin: 50px auto ;display: block; border:1px solid black;"></canvas>
</body>
</html>我运行了一次，发现你的效果也很酷啊。。。，其实是因为你的drawStar()的函数少写了一行“cxt.beginPath()”。（另外你的drawStar()函数应该放在window.onload外面。）
你是故意的。艺术家
加一个“cxt.beginPath()”就没问题了
差哪儿了？