TOP

SVG ellipse要素

中心座標と、x方向、y方向の半径を指定して、楕円を描きます。

楕円を描いたサンプルプログラム

<ellipse cx="600" cy="600" rx="200" ry="100" fill="red"
   stroke="blue" stroke-width="10" />

ellipse要素の主な属性

属性名
cx円の中心の X 座標
cy円の中心の Y 座標
rxx方向の半径
ry y方向の半径
stroke 線の色を指定します。
例:stroke="red" stroke="#FF11BB"  stroke="none"
fill 塗りつぶし色を指定します。
例:fill="red"  fill="#FF11BB"  fill="none"
fill-opacity 塗りつぶしの透明度を指定します。
0(透明)~1(不透明) 例:fill-opacity="0.5"
stroke-opacity 線の透明度を指定します。
0(透明)~1(不透明) 例:stroke-opacity="0.5"
opacity 全体の透明度を指定します。
0(透明)~1(不透明) 例:opacity="0.5"
stroke-dasharray 線を点線にします。数値をカンマまたは空白で区切る。
例:stroke-dasharray="10,20"