Value cannot be null. (Parameter 'source') Error in Apex Chart in Blazor-CodePudding

I have created a simple bar chart component using Apex Chart in blazor. But I got this error message.

blazor.webassembly.js:1 crit: Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100] Unhandled exception rendering component: Value cannot be null. (Parameter 'source') System.ArgumentNullException: Value cannot be null. (Parameter 'source') at System.Linq.ThrowHelper.ThrowArgumentNullException(ExceptionArgument argument) at System.Linq.GroupedEnumerable2[[BlazorApexCharts.Docs.Order, BlazorApexCharts.Docs, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null],[System.Object, System.Private.CoreLib, Version=5.0.0.0, Culture=neutral, PublicKeyToken=7cec85d7bea7798e]]..ctor(IEnumerable1 source, Func2 keySelector, IEqualityComparer1 comparer) at System.Linq.Enumerable.GroupBy[Order,Object](IEnumerable1 source, Func2 keySelector) at ApexCharts.ApexPointSeries1[[BlazorApexCharts.Docs.Order, BlazorApexCharts.Docs, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].GetData() in ..\ApexChart\Blazor-ApexCharts\src\Blazor-ApexCharts\Series\ApexPointSeries.cs:line 74 at ApexCharts.ApexChart1[[BlazorApexCharts.Docs.Order, BlazorApexCharts.Docs, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].SetSeries() in ..\ApexChart\Blazor-ApexCharts\src\Blazor-ApexCharts\ApexChart.razor.cs:line 222 at ApexCharts.ApexChart1.<Render>d__55[[BlazorApexCharts.Docs.Order, BlazorApexCharts.Docs, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].MoveNext() in ..\ApexChart\Blazor-ApexCharts\src\Blazor-ApexCharts\ApexChart.razor.cs:line 203 at ApexCharts.ApexChart1.d__44[[BlazorApexCharts.Docs.Order, BlazorApexCharts.Docs, Version=1.0.0.0, Culture=neutral, PublicKeyToken=null]].MoveNext() in ..\ApexChart\Blazor-ApexCharts\src\Blazor-ApexCharts\ApexChart.razor.cs:line 46

BarChart Component Code

@page "/test-bar-chart"
@using System.Net.Http
@using System.Net.Http.Json
@using System.Threading.Tasks
@inject HttpClient Http

<DemoContainer>
<ApexChart TItem="Order"
           Title="Order Net Value">

    <ApexPointSeries TItem="Order"
                Items="Orders"
                Name="Gross Value"
                XValue="@(e => e.Country)"
                YAggregate="@(e => e.Sum(e => e.GrossValue))"
                OrderByDescending="e=>e.Y"
                SeriesType="SeriesType.Bar"
                />

</ApexChart>
</DemoContainer>

@code {

    private List<Order> Orders { get; set; } 

    protected override async Task  OnInitializedAsync()
    {
        try
        {
            Orders=  await Http.GetFromJsonAsync<List<Order>>("/api/Apx");
        }
        catch (Exception ex)
        {
            Orders = null;
            Console.WriteLine(ex.Message);
        }

        
        await base.OnInitializedAsync();
    }


}

Order.cs

public class Order
{
    public Guid OrderId { get; set; } = Guid.NewGuid();
    public string CustomerName { get; set; }
    public string Country { get; set; }
    public DateTimeOffset OrderDate { get; set; }
    public OrderType OrderType { get; set; }
    public decimal GrossValue { get; set; }
    public decimal NetValue { get =>  GrossValue * (1 - (DiscountPrecentage / 100)) ; }
    public decimal DiscountPrecentage { get; set; }
}

public enum OrderType
{
    Web, Contract, Mail, Phone
}

How can I solve this?? please help me, appreciate your all answers

CodePudding user response：

You are providing a null Object, Which is not supported by the library. You should initialize the Orders variable like this:

private List<Order> Orders { get; set; } = new();

or wrap up the whole apexchart tag in a if condition like this:

@if(Orders is not null) 
{
    <ApexChart TItem="Order"
           Title="Order Net Value">
    ......
    ......
    </ApexChart>
}