$("#sky").bind("click",function () {
? ? ? ? ? ?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;
? ? ? ? ? ? ? ?sky(x, y, r, r / 2, a);
? ? ? ? ? ?}
? ? ? ?}
? ?)
function sky(x,y,outerR,innerR,rot){
? ?var canvas = document.getElementById("canvas");
? ?canvas.width = 1600;
? ?canvas.height = 700;
? ?var context=canvas.getContext("2d");
? ?context.fillStyle="black";
? ?context.fillRect(0,0,canvas.width,canvas.height);
? ?context.beginPath();
? ?for(var i=0;i<5;i++){
? ? ? ?context.lineTo(Math.cos((18+i*72-rot)/180*Math.PI)*outerR+x,
? ? ? ? ? ? ? ?-Math.sin((18+i*72-rot)/180*Math.PI)*outerR+y);
? ? ? ?context.lineTo(Math.cos((54+i*72-rot)/180*Math.PI)*innerR+x,
? ? ? ? ? ? ? ?-Math.sin((54+i*72-rot)/180*Math.PI)*innerR+y);
? ?}
? ?context.closePath();
? ?context.fillStyle="#fb3"
? ?context.strokeStyle="#fd5"
? ?context.lineWidth=3;
? ?context.lineJoin="round";
? ?/* 線的三種相交方式 ?bevel round
? ? context.lineJoin="bevel"; ? ?*/
? ?context.fill();
? ?context.stroke();
}