mirror of
https://github.com/radzenhq/radzen-blazor.git
synced 2026-07-08 18:16:08 +00:00
47 lines
1.8 KiB
Plaintext
47 lines
1.8 KiB
Plaintext
<RadzenStack class="rz-p-0 rz-p-md-6 rz-p-lg-12">
|
|
<RadzenRow>
|
|
<RadzenColumn Size="12">
|
|
<RadzenChart Animate="true">
|
|
<RadzenColumnSeries FillMode="FillMode.Gradient" Data="@data" CategoryProperty="Month" ValueProperty="Value" Title="Monthly Profit and Loss"
|
|
FillRange="@fillRange">
|
|
</RadzenColumnSeries>
|
|
<RadzenColumnOptions Radius="0" />
|
|
<RadzenValueAxis>
|
|
<RadzenGridLines Visible="true" />
|
|
</RadzenValueAxis>
|
|
<RadzenLegend Visible="false" />
|
|
</RadzenChart>
|
|
</RadzenColumn>
|
|
</RadzenRow>
|
|
</RadzenStack>
|
|
|
|
@code {
|
|
class ProfitLossData
|
|
{
|
|
public string Month { get; set; }
|
|
public double Value { get; set; }
|
|
}
|
|
|
|
ProfitLossData[] data = new[]
|
|
{
|
|
new ProfitLossData { Month = "Jan", Value = 200 },
|
|
new ProfitLossData { Month = "Feb", Value = -800 },
|
|
new ProfitLossData { Month = "Mar", Value = -1200 },
|
|
new ProfitLossData { Month = "Apr", Value = -2500 },
|
|
new ProfitLossData { Month = "May", Value = -300 },
|
|
new ProfitLossData { Month = "Jun", Value = 600 },
|
|
new ProfitLossData { Month = "Jul", Value = 3800 },
|
|
new ProfitLossData { Month = "Aug", Value = 3200 },
|
|
new ProfitLossData { Month = "Sep", Value = 2800 },
|
|
new ProfitLossData { Month = "Oct", Value = 3500 },
|
|
new ProfitLossData { Month = "Nov", Value = 3000 },
|
|
new ProfitLossData { Month = "Dec", Value = 3600 },
|
|
};
|
|
|
|
List<SeriesColorRange> fillRange = new()
|
|
{
|
|
new SeriesColorRange { Min = -10000, Max = 0, Color = "var(--rz-danger)" },
|
|
new SeriesColorRange { Min = 0, Max = 10000, Color = "var(--rz-success)" },
|
|
};
|
|
}
|