ストロークの使い方
stroke：線の色を指定するstroke-width：線の幅を指定するstroke-opacity：線の透明度を指定するstroke-linecap：線の両端の形状を指定するstroke-linejoin：頂点の形状を指定するstroke-dasharray：線のパターンを指定するstroke-dashoffset：パターンの開始位置を指定する
参考：
SVG でアウトラインをカスタマイズしてみよう | Web クリエイターボックス
SVG Stroke Properties | W3Schools
線種 (stroke-dasharray / stroke-dashoffset)
参考：
SVG でアウトラインをカスタマイズしてみよう | Web クリエイターボックス
stroke-dashoffset | CSS-Tricks
SVG Stroke Properties | W3Schools
stroke-linecap
butt：打ち切り (デフォルト)round：丸square：四角
参考：
SVG でアウトラインをカスタマイズしてみよう | Web クリエイターボックス
アニメーション
参考：
SVG のアニメーションで線を引く方法まとめ (IEへの対応も)｜2.IDEA
プラグインなしで作る SVG アニメーション (パスに沿って描写されていくアニメーション) – Qiita
SVG で円をアニメーションさせたい時の MEMO – Qiita
How SVG Line Animation Works | CSS-Tricks
CSS/SVG Animated Circles | CodePen
marker
参考：
点線の点の形を自由に変える方法 | CreativeStyle
グラデーション
参考：