Question

我目前正在用SVG编程进行分配，而我似乎无法正确地做到这一点。所以我想要一个椭圆，这样可以变得越来越小，而不是在cx或cy中，而在ry中。我的问题是我该怎么做。因为当我尝试使用转换工具时，它不起作用。如您在下面的代码段中所见，我添加了第三个值。当我这样做时，它停止工作，但是我不知道如何使它工作。 this is an illustration to show what i want to achieve

编辑：我找到了一种使其工作的方法！（我已经发布了答案）

<ellipse id="experi2" cx="610" cy="330" rx="600" ry="250" style= "fill: #404040; stroke:black; stroke-width:10" filter="url(#blurryedge)" />


<animateTransform
 xlink:href="#experi2"
attributeName="transform"
type="translate"
from="610 330 250" <!-- when i added the third value it stopped working --> 
to=" 610 330 20"
begin="0s"
dur="2s"
Repeatcount="freeze"
/>

Answer 1

您需要将属性名称更改为“ ry”

如何使其工作：

<svg height="140" width="500">

<ellipse  cx="200" cy="80" rx="100" ry="50" style= "fill: pink; stroke:black; stroke-width:5"  >
<animate attributeName="ry" begin="0s" dur="4s" repeatCount="freeze" from="35%" to="0.1%"/>
</ellipse>
<!-- you just change the attributeName -->

</svg>

（如果您对此有任何疑问，请随时提问）

在SVG中转换椭圆

1 个答案: