SVG cuts off circle-CodePudding

I have such code:

<svg width="100" height="100">
   <circle cx="50" cy="50" r="50" stroke="green" stroke='1' stroke-width="1" fill='yellow'/>
</svg>

in result i get cutted off circle.

Is it any method to draw full circle without decreasing circles radius ?

CodePudding user response：

The stroke width is both inside and outside the stroke line. In the example I changed the radius to 49.5 for the stroke that has the width 1. In the second example I made the stroke thicker (10) and half transparent, so that you can see that the stoke cover part of the fill on the inside and outside.

<svg width="100" height="100">
   <circle cx="50" cy="50" r="49.5" stroke="green" stroke-width="1" fill='yellow'/>
</svg>

<svg width="100" height="100">
   <circle cx="50" cy="50" r="45" stroke="darkblue" stroke-opacity=".5" stroke-width="10" fill='yellow'/>
</svg>