SVG的圖形填充規(guī)則通過fill-rule屬性來指定嗅绰。
‘fill-rule’
有效值:
nonzero | evenodd | inherit
默認(rèn)值:
nonzero
應(yīng)用于:
shape形狀類元素 和 文字內(nèi)容類元素
可繼承:
是
比例:
無
媒體:
可見
動(dòng)畫可用:
是
‘fill-rule’ 屬性用于指定使用哪一種算法去判斷畫布上的某區(qū)域是否屬于該圖形“內(nèi)部” （內(nèi)部區(qū)域?qū)⒈惶畛洌┞蚓觥?duì)一個(gè)簡(jiǎn)單的無交叉的路徑，哪塊區(qū)域是“內(nèi)部” 是很直觀清除的晓褪。但是，對(duì)一個(gè)復(fù)雜的路徑，比如自相交或者一個(gè)子路徑包圍另一個(gè)子路徑序调，“內(nèi)部”的理解就不那么明確了。
‘fill-rule’ 屬性提供兩種選項(xiàng)用于指定如何判斷圖形的“內(nèi)部”:
nonzero
字面意思是“非零”兔簇。按該規(guī)則发绢，要判斷一個(gè)點(diǎn)是否在圖形內(nèi)硬耍，從該點(diǎn)作任意方向的一條射線，然后檢測(cè)射線與圖形路徑的交點(diǎn)情況边酒。從0開始計(jì)數(shù)经柴，路徑從左向右穿過射線則計(jì)數(shù)加1，從右向左穿過射線則計(jì)數(shù)減1墩朦。得出計(jì)數(shù)結(jié)果后坯认，如果結(jié)果是0，則認(rèn)為點(diǎn)在圖形外部氓涣，否則認(rèn)為在內(nèi)部牛哺。下圖演示了nonzero規(guī)則:
點(diǎn)擊查看示例SVG文件 (僅適用于支持SVG的瀏覽器)
evenodd
字面意思是“奇偶”。按該規(guī)則劳吠，要判斷一個(gè)點(diǎn)是否在圖形內(nèi)引润，從該點(diǎn)作任意方向的一條射線，然后檢測(cè)射線與圖形路徑的交點(diǎn)的數(shù)量痒玩。如果結(jié)果是奇數(shù)則認(rèn)為點(diǎn)在內(nèi)部淳附，是偶數(shù)則認(rèn)為點(diǎn)在外部。下圖演示了evenodd 規(guī)則:
點(diǎn)擊查看示例SVG文件 (僅適用于支持SVG的瀏覽器)
(提示: 上述解釋未指出當(dāng)路徑片段與射線重合或者相切的時(shí)候怎么辦凰荚，因?yàn)槿我夥较虻纳渚€都可以燃观，那么只需要簡(jiǎn)單的選擇另一條沒有這種特殊情況的射線即可。)
