SVG:楕円 - suto3の大福帳

SVG:楕円

楕円（ellipse）

ellipse - SVG: Scalable Vector Graphics | MDN

SVG:ellipse要素

https://svg-hosting.vercel.app/api/svg?url=https://scrapbox.io/api/code/suto3/SVG:楕円/e.svg

code:e.svg

<svg width="300px" height="300px" viewBox="-100 -300 1000 800" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" >

<g id="R1" transform="translate(200 200)">

<ellipse rx="100" ry="0" fill="red" opacity=".2">

<animateTransform attributeName="transform" type="rotate" dur="7s" from="0" to="360" repeatCount="indefinite"/>

<animate attributeName="cx" dur="8s" values="-20; 220; -20" repeatCount="indefinite"/>

<animate attributeName="ry" dur="3s" values="10; 60; 10" repeatCount="indefinite"/>

</ellipse>

</g>

<use xlink:href="#R1" transform="rotate(72 390 150)" />

<use xlink:href="#R1" transform="rotate(144 390 150)" />

<use xlink:href="#R1" transform="rotate(216 390 150)" />

<use xlink:href="#R1" transform="rotate(288 390 150)" />

</svg>

https://img.shields.io/badge/SVG-楕円-FFB13B.svg?logo=svg&style=for-the-badge