Как сделать закругление circle на svg?

Question

[alaskafx]

Есть такой код:

<svg width="500" viewBox="0 15 100 35">
                            <circle rx="20" r='31.84713375796178' cx="50" cy="50" fill="none" stroke="#ccc" stroke-width="2" />
                            <circle rx="20" r='31.84713375796178' cx="50" cy="50" fill="none" stroke="#06ff00" stroke-width="2"
                                stroke-dasharray="100 300" id="circle" />
                        </svg>

Это полу заполняющийся круг, где первый элемент — это сам круг, а второй — это заполнение.
Я бы хотел сделать закругление краев этих circle - как я могу это сделать?

Comments

[Максим]

stroke-linecap: round оно вроде

Answer 1

[Сергей]

Может, вы говорите про это?
htmlbook.ru/css3-na-primerakh/skruglennye-ugolki

Comments

[alaskafx]

Неа

Answer 2

[lebedevweb]

Подсмотреть можно на developer.mozilla.org