How do you update the nodes and connectors of a SyncFusion UWP Diagram programmatically?

Question

I'm evaluating the SyncFusion SfDiagram and am having trouble finding a way to update the nodes and connectors from my C# in UWP? I'm testing against their sample given in the Getting Started documentation and modified the EmpId to be a string. The result is that the new node is added but the original nodes still are displayed. I would expect to only see the two nodes that I add in the C# code.

I'm finding their documentation a bit confusing. I've tried the following:

XAML

<local:Employees  x:Name="EmployeesCollection" x:Key="Employees">
    <local:Employee Name="Elizabeth" EmpId="1" ParentId="" Designation="CEO"/>
    <local:Employee Name="Christina" EmpId="2" ParentId="1" Designation="Manager"/>
</local:Employees>

C#

EmployeesCollection.Clear();
employee e = new Employee();
e.Name = t.Designation = e.EmpId = "10";
e.ParentId = "";
EmployeesCollection.Add(e);

employee e = new Employee();
e.Name = t.Designation = e.EmpId = "11";
e.ParentId = "10";
EmployeesCollection.Add(e);

diagram.UpdateLayout();

Answer 1

Please update the datasource settings as follows at run time,

 Employees employees = new Employees(); 
    DataSourceSettings settings = new DataSourceSettings(); 
    settings.ParentId = "ParentId"; 
    settings.Id = "EmpId"; 


    employees.Add(new Employee() { EmpId = 1, ParentId = "", Name = "Charly", Designation = "Manager" }); 
    employees.Add(new Employee() { EmpId = 2, ParentId = "1", Name = "Ronald", Designation = "TeamLead" }); 

    settings.DataSource = employees; 
    sfdiagram.DataSourceSettings = settings; 

The RefreshFrequency property support for LayoutManager. The RefreshFrequency property is used to update the Layout whenever the Nodes or Connectors collection is Changed. The provided code example to represent this. Please refer to the code example as below.

Code example:

sfdiagram.LayoutManager.RefreshFrequency = RefreshFrequency.ArrangeParsing;

Here, sfdiagram is instance of SfDiagram 

For more information, please refer to the knowledge base link as below.

https://www.syncfusion.com/kb/6258/how-to-update-layout-automatically-when-collection-is-changed

Suggestion 2: The UpdateLayout method support for Layout. It is used to arrange the Node Position.The provided the code example to represent this.

Code Example:

//Diagram Loaded Event 
sfdiagram.Loaded += MainWindow_Loaded; 
void MainWindow_Loaded(object sender, RoutedEventArgs e) 
{ 
sfdiagram.LayoutManager.Layout.UpdateLayout(); 
} 

Here, sfdiagram is instance of SfDiagram. 

For more information about UpdateLayout, please refer the documentation link as below.

Documentation link: https://help.syncfusion.com/wpf/sfdiagram/automatic-layouts#updating-the-layout

Regards,

Keerthivasan R.