6
假設您有多個SVG標記,每個SVG標記在其中定義一個具有相同ID的不同剪輯路徑。clipPath在多個SVG標記中
<svg id="svg1" width="200" height="200">
<defs>
<clipPath id="nodeclipper">
<rect width="100" height="100" x="0" y="0" />
</clipPath>
</defs>
</svg>
<svg id="svg2" width="200" height="200">
<defs>
<clipPath id="nodeclipper">
<circle cx="20" cy="0" r="40" />
</clipPath>
</defs>
</svg>
我也做了JSFiddle。預期的行爲是什麼?我認爲,一個元素只能引用自己的SVG標籤中的定義,但似乎並沒有這樣的情況:
- 鉻26:使用
circle
夾路徑兩次。 - Firefox 17:使用
rect
剪輯路徑兩次。 - Safari 6:按預期呈現一個
rect
和一個circle
剪輯路徑。
會很奇怪,當你hide one of the SVG tags因爲Chrome和Safari然後刪除clip-path
完全。
我知道它適用於clipPath
有不同的ID,但它應該是這樣嗎?據我看到spec不包含有關問題的信息。
Upvoted參考規範。雖然它在技術上是正確的,但在SVG文檔嵌入到頁面中的情況下,它也是非常精彩的行爲。 SVG通常來自各種來源,並且爲了讓用戶必須解析並重新命名空間,避免潛在的衝突非常不友好。 – 2015-01-22 19:40:10
此外,鑑於html文檔(非xml)內有兩個單獨的svg文檔(xml) - 是否屬於同一規範? – 2015-01-22 19:42:53
只有一個文件。 – 2015-01-22 19:44:52