Datasource-based Diagram not updated if data changes

[Daniel Koffler]

Hello,

my diagram uses DataSource which is defined in DataSourceSettings.

The DataSource property refers to ObservableCollection.

My expectation was that if I change the ObservableCollection at runtime the digram updates accordingly.

However this is not the case.

Also I tried to call the method RefreshDataSource(), but this did not have any effect either.

Kindly let me know how I can dynamically update the diagram if using an ObservableCollection as its datasource.

Thank you

Daniel

[Balavignesh RaviChandran]

We have created and attached a sample for your requirement to change the ObservableCollection at runtime, and the diagram updates accordingly. Please find the sample in the following link.
https://github.com/SyncfusionExamples/Blazor-Diagram-Examples/tree/master/Samples/CollectionChangeInDataSource/CollectionChangeInDataSource

 

I hope this sample will satisfy your requirements. If you still have problems achieving your requirements, kindly explain them in more detail; this will help us provide a solution.

 

[Daniel Koffler]

Hello,

please find attached an example which mimics my real-world example. As you can see the diagram is not populated with data which is loaded in the "OnInitializedAsync()". All the examples you provide have a simplified approach preparing the data in the constructor. Which works fine.

Kindly let me know what is needed so that my "ViewModel.GetItemsCommand.Execute()" can load data which is then shown in the diagram from the beginning.

Than you

Daniel

Attachment: CollectionChangeInDataSource_3ea75bc6.zip

[Balavignesh RaviChandran]

Thank you for sharing the example. The issue arises because the data for the diagram is being loaded asynchronously in OnInitializedAsync(), which may not immediately reflect in the diagram component.

To ensure the data is available before rendering the diagram, we recommend initializing the data source in OnAfterRenderAsync(bool firstRender), as shown in the following code snippet:

protected override async Task OnAfterRenderAsync(bool firstRender){
    if (firstRender)
    {        
        await ViewModel.GetItemsCommand.Execute();
        
    }
}

This ensures that the command execution happens after the component is first rendered, allowing the diagram to receive the updated data.

Let us know if you need further assistance!

Best regards,

Balavignesh R