如果當前路徑是循環的，或者包含多個相交的子路徑，那么Canvas的繪圖環境變量就必須判斷，當fill()方法被調用時，應該如何對當前路徑進行填充。

Canvas在填充互相有交叉的路徑時，使用非零環繞規則

非零環繞

對于路徑中的任意給定區域，從該區域內部畫一條足夠長的線段，使此線段的終點完全落在路徑范圍之外。

接下來將計數器初始化為0，然后，每當這條線段與路徑上的直線或曲線相交時，就改變計算器的值。如果是與路徑的順時針部分相交，則加1，如果與路徑的逆時針相交，則減1。
若計算器的最終值不是0，那么此區域就在路徑里面，在調用fill()方法時，瀏覽器就會對其進行填充。如果最終值是0，那么此區域就在路徑內部，瀏覽器就不會對其進行填充。

轉載于:https://www.cnblogs.com/MyNodeJs/p/9651998.html

總結

以上是生活随笔為你收集整理的填充路径时使用的非零环绕规则的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。