37 lines
2.0 KiB
Plaintext
37 lines
2.0 KiB
Plaintext
|
|
<svg viewBox="0 0 200 200" width="100%" height="100%" xmlns="http://www.w3.org/2000/svg">
|
|
<circle cx="100" cy="100" r="@innRad" fill="none" stroke="rgba(189, 195, 199, 0.5)" stroke-width="@sWidth" />
|
|
@foreach (var item in ListInner)
|
|
{
|
|
<circle cx="100" cy="100" r="@innRad" fill="none" stroke="@item.Color" stroke-width="@sWidth" stroke-linecap="round" transform="rotate(-90,100,100)" stroke-dasharray="calc(@innRad * 6.2832 * @item.Value / @maxVal) calc(@innRad * 6.2832 * (@maxVal - @item.Value) / @maxVal)" />
|
|
}
|
|
@if (ShowCircleBtn)
|
|
{
|
|
<defs>
|
|
<radialGradient id="RadialGrad2">
|
|
<stop offset="0%" stop-color="#000000" />
|
|
<stop offset="80%" stop-color="#151515" />
|
|
<stop offset="90%" stop-color="#444444" />
|
|
<stop offset="100%" stop-color="#878787" />
|
|
</radialGradient>
|
|
</defs>
|
|
<circle cx="100" cy="100" r="@(innRad-sWidth)" fill="url(#RadialGrad2)" fill-opacity="0.5">
|
|
</circle>
|
|
}
|
|
@if (showOuter)
|
|
{
|
|
<circle cx="100" cy="100" r="@outRad" fill=none stroke="rgba(189, 195, 199, 0.5)" class="bg-opacity-25" stroke-width="@sWidth" />
|
|
@foreach (var item in ListOuter)
|
|
{
|
|
<circle cx="100" cy="100" r="@outRad" fill="none" stroke="@item.Color" stroke-width="@sWidth" stroke-linecap="round" transform="rotate(-90,100,100)" stroke-dasharray="calc(@outRad * 6.2832 * @item.Value / @maxVal) calc(@outRad * 6.2832 * (@maxVal - @item.Value) / @maxVal)" />
|
|
}
|
|
@* <circle cx="100" cy="100" r="@outRad" fill=none stroke="@StrokeColorValOuter" stroke-width="@sWidth" stroke-linecap="round" transform="rotate(-90,100,100)" stroke-dasharray="calc(@outRad * 6.28 * @valOuter / @maxVal) calc(@outRad * 6.28 * (@maxVal - @valOuter) / @maxVal)" /> *@
|
|
}
|
|
<g transform="translate(100,100)">
|
|
<text id="TitleElem" style="@StyleTitolo" x="0" y="0">@Titolo</text>
|
|
<text x="0" y="30" style="@StyleTesto">@Testo</text>
|
|
</g>
|
|
|
|
|
|
</svg>
|