<!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>
2016-01-11
我運(yùn)行了一次，發(fā)現(xiàn)你的效果也很酷啊。。。，其實(shí)是因?yàn)槟愕膁rawStar()的函數(shù)少寫(xiě)了一行“cxt.beginPath()”。（另外你的drawStar()函數(shù)應(yīng)該放在window.onload外面。）
2016-08-18
你是故意的。藝術(shù)家
2016-04-10
加一個(gè)“cxt.beginPath()”就沒(méi)問(wèn)題了
2016-01-06
差哪兒了？