HTML

SVG

  • M(Move)やL(Line)がコマンドとなっている。

    • M ... "Move To" コマンド。指定した位置に移動する。始点などに使う。

    • L ... "Line To" コマンド。指定した位置に直線をひく。

    • Z ... "Close Path" コマンド。終点などに使い、始点までの線をひく。

  • 単純な三角形はこのようになる。

<svg width="100" height="100">
  <path d="M50 0 L0 100 L100 100 Z" style="fill:red"></path>
</svg>
  • 参考

    • https://developer.mozilla.org/ja/docs/Web/SVG/Tutorial/Paths

    • https://www.kipure.com/article/93/

半角スペースを入れる

&nbsp;

Last updated