window.onload=function(){

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

canvas.width=1000;

canvas.height=600;

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

// context.beginPath();

// // for(var i=0;i<5;i++){

// // context.lineTo(Math.cos((18+72*i)/180*Math.PI)*200+300,-Math.sin((18+72*i)/180*Math.PI)*200+300);

// // context.lineTo(Math.cos((54+72*i)/180*Math.PI)*100+300,-Math.sin((54+72*i)/180*Math.PI)*100+300);

// // }

// context.closePath();

for(var j=0;j<8;j++){

drawStar(context,40,20,j+3,50+j*110,300);

context.stroke();

}

}

function drawStar(cxt,R,r,K,x,y){

cxt.beginPath();

for(var i=0;i<K;i++){

cxt.lineTo(Math.cos((360/K*i)/180*Math.PI)*R+x,-Math.sin((360/K*i)/180*Math.PI)*R+y);

cxt.lineTo(Math.cos((360/K*i+180/K)/180*Math.PI)*r+x,-Math.sin((360/K*i+180/K)/180*Math.PI)*r+y);

}  

cxt.closePath();

}