Создать диаграмму с помощью SVG - PullRequest
0 голосов
/ 09 января 2019

Я хочу создать диаграмму, которая будет круговой, но должна быть больше, чем полукруг.

Я использую приведенный ниже код, но он дает полный круг на 360 градусов. Но я надеюсь, что круг будет похож на радиальный спидометр, поэтому я не уверен, как добавить начальный угол и конечный угол.

<svg width="100%" viewBox="0 0 42 42" class="donut">
    <text font-size="3" x="18%" y="19%" text-anchor="middle" alignment-baseline="middle">11</text>
    <circle class="donut-segment" cx="8" cy="8" r="4" fill="transparent" stroke="gray" stroke-width="0.8" stroke-dasharray="36,0" stroke-dashoffset="0"></circle>
    <circle class="donut-segment" cx="8" cy="8" r="4" fill="transparent" stroke="blue" stroke-width="0.8" stroke-dasharray="11,25" stroke-dashoffset="0"></circle>
</svg>
...