如何避免剪輯路徑與形狀一起縮放？

我有一個包含「clipPath」和「g」的元素下面的「DEFS」元素：如何避免剪輯路徑與形狀一起縮放？

<defs> 
    <clipPath id="myClip"> 
     <rect x="0" y="0" width="200" height="200"/> 
    </clipPath> 
    <g id="myGroup"> 
     <circle id="bb" cx="100" cy="100" r="120" stroke="#ff0000" fill="#0000ff" clip-path="url(#myClip)"/> 
     <circle id="cc" cx="150" cy="150" r="90" stroke="#00ff00" fill="#ff00ff" clip-path="url(#myClip)"/> 
    </g> 
</defs>

當g組件顯示在下面的方式，剪輯路徑工程只是罰款：

<use transform="scale(1)" xlink:href="#myGroup"/>

但是如果將scale（1）替換爲大於1的任何值，則所有內容都將超出剪切邊界。當「#myGroup」被縮放爲2或任何其他大於1的值時，我能做些什麼來實現剪輯路徑？爲了澄清：似乎剪輯路徑與組一起縮放，我不需要那樣。由於

來源

2013-08-20 bp2017

我認爲你必須把你的剪輯的東西，不進行縮放，這樣的事情也許......

<defs> 
    <clipPath id="myClip"> 
     <rect x="0" y="0" width="200" height="200"/> 
    </clipPath> 
    <g id="myGroup"> 
     <circle id="bb" cx="100" cy="100" r="120" stroke="#ff0000" fill="#0000ff"/> 
     <circle id="cc" cx="150" cy="150" r="90" stroke="#00ff00" fill="#ff00ff"/> 
    </g> 
</defs> 

<g clip-path="url(#myClip)"> 
    <use transform="scale(2)" xlink:href="#myGroup"/> 
</g>

來源

2013-08-20 16:16:52

如何避免剪輯路徑與形狀一起縮放？

回答

相關問題