七巧板顏色填充的問(wèn)題?
我寫(xiě)了代碼但是顏色總是填充不上是什么原因呢?
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();
? ? ? ?}
? ?}
};
2016-08-18
這段要放在for的外面:
? ? ? ? ? ?content.closePath();
? ? ? ? ? ?content.fillStyle=tangram.color;
? ? ? ? ? ?content.fill();
? ? ? ? ? ?content.strokeStyle='black';
? ? ? ? ? ?content.lineWidth=2;
? ? ? ? ? ?content.stroke();