How to join edges of 2 SVG lines?

How to merge / join 2 SVG lines whose edges are intersecting ?

SVG EXAMPLE

>Solution :

If you set the stroke-linecap to stroke-linecap="square" they will join/overlap.

<svg xmlns="http//www.w3.org/2000/svg" viewBox="0 0 10 10" width="300"
stroke="black" stroke-width="1" stroke-linecap="square">
  <line x1="2" y1="2" x2="8" y2="2"  />
  <line x1="8" y1="2" x2="8" y2="8" />
</svg>

Leave a Reply