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

canvas.width?=?800;
canvas.height?=?800;

var?ctx?=?canvas.getContext("2d");
ctx.fillStyle?=?"f00";
ctx.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(ctx,x,y,r,r/2.0,a);
}
ctx.lineCap?=?"butt";??//round?square
//ctx.lineJoin?=?"bevel";??//?平角效果

//ctx.lineJoin?=?"round";??//?圓角效果

ctx.lineJoin?=?"miter";??//?尖角限制
ctx.miterLimit?=?20;

//drawStar(ctx,20,50,400,400,0);

function??drawStar(cx,r,R,x,y,rot)?{
????cx.beginPath();

????for(var?i?=?0;?i?<?5;?i++)?{
????????cx.lineTo(Math.cos((18?+?i*72?-?rot)/180?*?Math.PI)?*?R?+?x,
????????????-Math.sin((18?+?i*72?-?rot)/180?*?Math.PI)?*?R?+?y
????????);
????????cx.lineTo(Math.cos((54?+?i*72?-?rot)/180?*?Math.PI)?*?r?+?x,
????????????-Math.sin((54?+?i*72?-?rot)/180?*?Math.PI)?*?r?+?y
????????)
????}
????cx.closePath();
????cx.fillStyle?=?"fb3";
????cx.strokeStyle?=?"fd5";
????cx.lineWidth?=?3;
????cx.fill();
????cx.stroke();
}