클립 경로가 모양과 함께 조정되지 않도록하려면 어떻게해야합니까?

Question

I "clipPath"와 "g"요소가 들어있는 다음 "인증 된 정의"요소가 있습니다

G 코드 요소는 다음과 같은 방법으로 표시됩니다

<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> 

, 클립 경로가 잘 작동 :

을

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

그러나 scale (1)이 1보다 큰 값으로 대체되면 모든 것이 클리핑 경계에서 벗어납니다. "#myGroup"이 2 또는 1보다 큰 다른 값으로 조정될 때 클립 경로 작업을 수행하려면 어떻게해야합니까? 명확히하기 위해 : 그것은 클립 경로가 그룹과 함께 스케일 된 것처럼 보이지만, 나는 그것을 필요로하지 않습니다. 감사합니다

Answer 1

나는 ... 당신이 조절되지 않습니다 뭔가, 아마 이런 식으로 뭔가에 클리핑을 넣어야 할 거라고 생각

<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>