我写了代码但是颜色总是填充不上是什么原因呢？

var tangram=[
   {p:[{x:0,y:0},{x:600,y:0},{x:300,y:300}],color:"#CEFE68"},
   {p:[{x:0,y:0},{x:300,y:300},{x:0,y:600}],color:"#69BED0"},
   {p:[{x:150,y:450},{x:0,y:600},{x:300,y:600}],color:"#FAF61C"},
   {p:[{x:300,y:300},{x:150,y:450},{x:450,y:450}],color:"#F13C64"},
   {p:[{x:450,y:150},{x:300,y:300},{x:450,y:450}],color:"#F78ECE"},
   {p:[{x:600,y:0},{x:450,y:150},{x:600,y:300}],color:"#A795C3"},
   {p:[{x:600,y:300},{x:300,y:600},{x:600,y:600}],color:"#F7C928"}
];
window.onload=function(){
   var canvas=document.getElementById('canvas');
       canvas.width=600;
       canvas.height=600;

       var content=canvas.getContext('2d');
   for(var i=0;i<tangram.length;i++){
       draw(tangram[i],content)
   }

   function draw(tangram,content){
       content.beginPath();
       content.moveTo(tangram.p[0].x,tangram.p[0].y);
       for(var i=1;i<tangram.p.length;i++){
           content.lineTo(tangram.p[i].x,tangram.p[i].y);

           content.closePath();

           content.fillStyle=tangram.color;
           content.fill();
           content.strokeStyle='black';
           content.lineWidth=2;
           content.stroke();
       }
   }

};