図形の線の頂点（連結部）の尖り状態を変更
SVGで図形の線の頂点（連結部）の尖り状態を変更するには、stroke-miterlimit属性を使用します。
角度によって尖り具合が変わり、角度が小さいほど鋭くなります。
構文
stroke-miterlimit="値"初期値は4です。
サンプルコードとデモ
XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 100" width="200" height="100">
<path d="M 10,0 l 0,20 l 100,30 l -100,30 l 0,20" fill="none" stroke="black" stroke-width="10" stroke-miterlimit="0" />
</svg>XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 100" width="200" height="100">
<path d="M 10,0 l 0,20 l 100,30 l -100,30 l 0,20" fill="none" stroke="black" stroke-width="10" stroke-miterlimit="4" />
</svg>XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 100" width="200" height="100">
<path d="M 10,0 l 0,30 l 100,20 l -100,20 l 0,30" fill="none" stroke="black" stroke-width="10" stroke-miterlimit="6" />
</svg>XML
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 100" width="200" height="100">
<path d="M 10,0 l 0,40 l 100,10 l -100,10 l 0,40" fill="none" stroke="black" stroke-width="10" stroke-miterlimit="11" />
</svg>