Files
radzen-blazor/RadzenBlazorDemos/Pages/DonutChartExplode.razor
2026-06-24 19:23:08 +03:00

29 lines
1.1 KiB
Plaintext

<RadzenStack class="rz-p-0 rz-p-md-6 rz-p-lg-12" AlignItems="AlignItems.Center">
<RadzenStack Style="width: 100%; max-width: 600px;">
<RadzenChart>
<RadzenDonutSeries FillMode="FillMode.Gradient" Data="@revenue" CategoryProperty="Category" ValueProperty="Value" Title="Revenue" ExplodeOffset="15" ExplodedProperty="Highlight">
<RadzenSeriesDataLabels Visible="false" />
</RadzenDonutSeries>
<RadzenLegend Position="LegendPosition.Bottom" />
</RadzenChart>
</RadzenStack>
</RadzenStack>
@code {
class DataItem
{
public string Category { get; set; }
public double Value { get; set; }
public bool Highlight { get; set; }
}
DataItem[] revenue = new DataItem[]
{
new DataItem { Category = "Cloud", Value = 4200, Highlight = true },
new DataItem { Category = "Licenses", Value = 3100 },
new DataItem { Category = "Services", Value = 2300 },
new DataItem { Category = "Support", Value = 1500 },
new DataItem { Category = "Training", Value = 900 },
};
}