Category:SVG simplification by linecapping

Often it is possible to draw circle structures with the stroke-linecap=round attribute, or rectangular ones with stroke-linecap=square.

Examples how to draw a circle[edit]

There are different possibilities to draw a simple bordered circle as shown with this example.

1. Bad solution: Very complicated drawing with cubic arcs (not a true trigonometric circle !)
2. conventional: <circle fill="#FEDE58" stroke="#000" stroke-width="10.5" x="175" cy="175" r="154"/>
   or in relatives:<circle fill="#FEDE58" stroke="#000" stroke-width="3%" cx="50%" cy="50%" r="44%"/>
3. with linecapping: needs two pathes,
   outside border <path d="m175,175h0" stroke-width="318.5" stroke-linecap="round" stroke="#000"/>
   and inside disk <path d="m175,175h0" stroke-width="298.5" stroke-linecap="round" stroke="#FEDE58"/>
4. with the "a" element: as a true circle
   <path fill="#FEDE58" stroke="#000" stroke-width="10.5" d="m175,21a154,154 0 1,0 0,308 154,154 0 1,0 0-308"/>

or shortened (not a true trigonometric circle – but for most cases the small flat interval won't matter)
<path fill="#FEDE58" stroke="#000" stroke-width="10.5" d="m174,21a154,154 0 1,0 2,0z"/>

While the shortened version of (4) will be the best solution for simple drawings, linecapping as in (3) can be an advantage, esp. when used with the stroke-dasharray attribute.
Needless to say that a mere disk without the border becomes simpler.