Chart does not update with dynamic datasource

I am setting up a chart:

<SfAccumulationChart @ref=Chart EnableBorderOnMouseMove="false" Title="Centre Bookings" EnableAnimation="true">
    <AccumulationChartTooltipSettings Header="" Format="<b>${point.x}</b><br>Centre Booking Share: <b>${point.y}%</b>" Enable="true"></AccumulationChartTooltipSettings>
    <AccumulationChartLegendSettings Visible="false"></AccumulationChartLegendSettings>
    <AccumulationChartSeriesCollection>
        <AccumulationChartSeries DataSource="@CentreChartPoints" XName="Centre" YName="Bookings" Radius="@Radius" StartAngle="@StartAngle" InnerRadius="40%" Name="Project" Explode="true" ExplodeOffset="10%" ExplodeIndex="0">
            <AccumulationDataLabelSettings Visible="true" Name="DataLabelMappingName" Position="AccumulationLabelPosition.Outside">
                <AccumulationChartConnector Length=@ConnectorLength Type="ConnectorType.Curve"></AccumulationChartConnector>
                <AccumulationChartDataLabelFont FontWeight="600" Size=@Size></AccumulationChartDataLabelFont>
            </AccumulationDataLabelSettings>
        </AccumulationChartSeries>
    </AccumulationChartSeriesCollection>
</SfAccumulationChart>


If I hard code items into the CentreChartPoints datasource, as per the Syncfusion documentation, it is working.

But, of course, nobody hard codes their data.  Everyone is fetching it dynamically.  If I do that, the chart doesn't show any data.

I could not find the documentation which explains how this should be done in practice, but I found that there was a Refresh() method on the Chart component.  I tried that, but still the chart does not show the data.


What am I missing?



2 Replies

BJ Brian J January 12, 2024 09:25 AM UTC

I'm sure there must be a way to do this, and that I am missing something.  But I was not able to find any documentation that explains it, and after a lot of playing around I could not get the chart to update off the dynamic datasource.

I tried a Blazorise chart and it is working, so have switched to that for now.



DG Durga Gopalakrishnan Syncfusion Team January 12, 2024 01:45 PM UTC

Hi Brain,


We have ensured your reported scenario with attached code snippet. We were able to update the accumulation chart datasource dynamically. We have prepared sample based on your requirement. Please check with the below snippet and screenshots.


<SfButton Content="Update" @onclick="@Click" IsPrimary="true"></SfButton>

@code {

    private void Click()

    {

        MedalDetails = new List<ChartData>

        {

            new ChartData { Country= "Australia", Medals= 16, Text="Australia : 16" },

            new ChartData { Country= "India", Medals= 36, Text="India : 36" },

            new ChartData { Country= "Nigeria", Medals= 12, Text="Nigeria : 12" },

            new ChartData { Country= "Brazil", Medals= 20, Text="Brazil : 20" },

        };

        StateHasChanged();

    }

}


Before Update



After Update



Sample : https://blazorplayground.syncfusion.com/LDVpXWWhgxtRXRTp


If you are still facing problem, please try to replicate an issue in above sample or share us issue reproduced sample to validate this case further from our end. Kindly revert us if you have any other concerns.


Regards,

Durga Gopalakrishnan.


Loader.
Up arrow icon