1

我使用代码在其中创建了一个 svg 和一个椭圆

<svg xmlns="http://www.w3.org/2000/svg" 
     version="1.1" 
     type="svgObj" 
     style="display: inline; position: relative; left: 0px; top: 0px;" 
     id="svg_5" 
     preserveAspectRatio="none">
  <ellipse type="svgShpObj" id="shape_2" cx="59px" cy="33px" rx="57px" ry="31px"
           fill="#A5A85A" stroke-width="10" stroke="#F5821F"
           stroke-opacity="1" fill-opacity="0.39215686274509803"/>
</svg>

将其粘贴到http://www.w3schools.com/svg/tryit.asp?filename=trysvg_myfirst并检查它剪辑椭圆的左侧和顶部的问题。如何解决这个问题？

4

1 回答 1

3

SVG 的“剪辑”部分只是在视口之外。

有几种方法可以“解决”这个问题。

您可以通过将相应的坐标更改为来重新定位椭圆（此处和此处的MDN 文档）

 cx="70px" cy="40px"

或者，您可以通过添加显式设置一个包含整个椭圆的视图框（MDN 文档），例如，

 viewBox="-10 -10 300 300"

到<svg>元素本身。

于 2012-07-13T15:26:01.483 回答