为什么我的星星没有填充色呢
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<style>
#canvas{display: block; border: 1px solid black; margin: 60px auto;}
</style>
<body>
<canvas id="canvas">
</canvas>
<script type="text/javascript">
window.onload = function(){
var canvas = document.getElementById('canvas');
var context = canvas.getContext('2d');
canvas.width = 800;
canvas.height = 800;
context.fillRect(0,0,canvas.width,canvas.height)
//一个画布中开始子路径的一个新的集合
drawStar(context,150,300,400,400,30);
}
//cxt:绘制环境 r：小圆半径 R：大圆半径 x，y：图像的位置 rot:旋转的角度
function drawStar(cxt,r,R,x,y,rot){
cxt.beginPath();
for (var i=0 ; i<5 ; i++) {
//大圆
cxt.lineTo(Math.cos((18+i*72-rot)/180*Math.PI )*R + x ,
-Math.sin((18+i*72-rot)/180*Math.PI )*R + y)
//小圆
cxt.lineTo(Math.cos((54+i*72-rot)/180*Math.PI )*r + x ,
-Math.sin((54+i*72-rot)/180*Math.PI )*r + y)
}
//一个画布中结束子路径的一个新的集合
cxt.closePath();
cxt.fillStyle = "#fb3";
cxt.strokeStyle = "#fd5";
cxt.lineWidth = 3;
cxt.lineJoin = 'round';
//画弧
cxt.stroke();
}
</script>
</body>
</html>
