This is a migrated thread and some comments may be shown as answers.

An example of reloading the graphsource and diagram updating correctly

4 Answers 308 Views
Diagram
This is a migrated thread and some comments may be shown as answers.
Jamie
Top achievements
Rank 1
Jamie asked on 28 Dec 2016, 04:11 AM

Hi.   I've been working off of the OrgChart example, which is a great example and is exactly what I need.  However, I'm still having issues when updating the graph source and having that layout correctly.   Now, all the nodes get stacked on top of each other.  Can you provide an example of how to get this working?  Take for example, the OrgChart sample app and provide a new demo where you can click a button and have it reload a completely new data set and have that layout correctly in the diagram?

 

Thanks very much

4 Answers, 1 is accepted

Sort by
0
Milena
Telerik team
answered on 30 Dec 2016, 08:22 AM
Hello Jamie,

If you take a look at OrgChartExample you will see that in OnOrgChartExampleLoaded we call 
LayoutOrgChart method where we layout the diagram shapes. You can use a similar logic to ensure the nodes don't get stacked when changing the graph source. More information about the diagram layout and its settings you can find in our help article here

I hope this information helps.

Regards,
Milena
Telerik by Progress
Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
0
Jamie
Top achievements
Rank 1
answered on 30 Dec 2016, 08:05 PM

Hi. Thanks for the reply.  The refresh doesn't actually reload the data collections themselves.  I attached the org chart sample project with some small modifications I made to illustrate my point.  Look at the LayoutButtonClicked function in OrgChartExample.xaml.cs.  
I'm clearing HierarchicalDataSource and then GraphSource and its InternalItems and InternalLinks and rebuild them with the exact same dataset.  The attached screenshot shows the result of that.  

Modified Org Chart Project
https://drive.google.com/file/d/0B7kwY92z8_56VFNBeXQ4SXpNVWs/view?usp=sharing

I appreciate any help on this.
Thanks

0
Accepted
Milena
Telerik team
answered on 04 Jan 2017, 01:06 PM
Hello Jamie,

The demo you are using is setup to work only with one graph source. In order to use the diagram in scenario with dynamic change of the graph source you need to do some changes: 
1. Remove xaml binding of graph source (GraphSource="{Binding GraphSource}" ) and set it in code behind (for the OrgChart demo you can set in the end of GetViewModelAndBindForEvents method). This allows you to make dynamic changes of the graph source.
2. Then in LayoutButtonClicked method you need to first clear the graph source and then set it again
3. Also you need to first clear the layout roots in SetLayoutRoots method,  then set it again and lastly layout the diagram: 
private void LayoutButtonClicked(object sender, RoutedEventArgs e)
{         
    this.diagram.GraphSource = null;
 
    this.viewModel.PopulateWithData();
    this.viewModel.PopulateGraphSources();
 
    this.diagram.GraphSource = this.viewModel.GraphSource;
 
    this.SetLayoutRoots();
    this.LayoutOrgChart(true);
}

4. You can also change the Layout with LayoutAsync in LayoutOrgChart method to layout the shapes asynchronously: 
private void LayoutOrgChart(bool shouldAutoFit)
{
    ...
    //this.treeLayout.Layout(this.diagram, this.viewModel.ChildTreeLayoutViewModel.CurrentLayoutSettings);
         this.diagram.LayoutAsync(LayoutType.Tree, this.viewModel.ChildTreeLayoutViewModel.CurrentLayoutSettings);
         ...
}

I hope this information will get you started.

Regards,
Milena
Telerik by Progress
Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
0
Jamie
Top achievements
Rank 1
answered on 11 Jan 2017, 05:57 PM

Hi.  This did work!  Thanks very much.  

I have not looked at the diagram control under the hood, so to speak, but I do think it should handle resetting/updating of the itemssource/graphdata purely via the bound collection.  But, at any rate, its a great control and I am now able to reload / reset the data which is what I need.  So thanks again!

Tags
Diagram
Asked by
Jamie
Top achievements
Rank 1
Answers by
Milena
Telerik team
Jamie
Top achievements
Rank 1
Share this question
or