html5中怎么做五角星

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

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

    context.beginPath();  

    //设置是个顶点的坐标，根据顶点制定路径  

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

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

                        -Math.sin((18+i*72)/180*Math.PI)*200+200);  

        context.lineTo(Math.cos((54+i*72)/180*Math.PI)*80+200,  

                        -Math.sin((54+i*72)/180*Math.PI)*80+200);  

    }  

    context.closePath();  

    //设置边框样式以及填充颜色  

    context.lineWidth="3";  

    context.fillStyle = "#F6F152";  

    context.strokeStyle = "#F5270B";  

    context.fill();  

    context.stroke();