なぜcanvas fill（）はfillStyleで指定された色で図形をペイントしませんか？

Question

なぜ、c.fillStyleの色が三角ですか？

var c= document.getElementById('myCanvas').getContext('2d'); 

//c.fillRect(20,10,250,175);// 

c.moveTo(225,75); 
c.lineTo(112.5,225); 

c.moveTo(112.5,225); 
c.lineTo(337.5,225); 

c.moveTo(337.5,225); 
c.lineTo(225,75); 

c.strokeStyle= '#9e9e9e'; 
c.stroke(); 

c.fillStyle= '#ffc061'; 
c.fill(); 

Answer 1

lineToの後にmoveToメソッドを呼び出すと、現在の位置をジャンプすることによって領域が塗りつぶされるためです。したがって、このようなmoveToメソッドを削除することで、この問題を解決できます。

c.moveTo(225,75); 
c.lineTo(112.5,225); 
c.lineTo(337.5,225); 
c.closePath(); 

c.strokeStyle= '#9e9e9e'; 
c.stroke(); 

c.fillStyle= '#ffc061'; 
c.fill();