在Canvas中使用fill()進行填充，遵循非零環繞填充規則。

非零環繞填充規則：如果想知道某一區域是否被填充，就從這一區域畫一條直線向外，在與其他線的交點處，如果其他線是順時針方向畫的，就+1，逆時針則-1，如果最後總和為0，則不會填充，非零則填充。

例如：假設有兩個長方形，外面大的長方形是順時針反方向畫的，裡面的小長方形是逆時針方向畫的。

var myCanvas = document.querySelector("canvas");
		var ctx = myCanvas.getContext("2d");

		// 大長方形,順時針
		ctx.moveTo(100,100);
		ctx.lineTo(400,100);
		ctx.lineTo(400,300);
		ctx.lineTo(100,300);
		ctx.closePath();

		// 小長方形，逆時針
		ctx.moveTo(150,150);
		ctx.lineTo(150,250);
		ctx.lineTo(350,250);
		ctx.lineTo(350,150);	
		ctx.closePath();	
		ctx.fill();
 

效果圖如下：