Rank 2
Iron
Veteran
Greetings,
Is it possible to populate a RadDiagram with a RadTreeView node's collection?
I tried saving an xml copy of my RadTreeView's nodes using SaveXml(), and then load it in a RadDiagram using RadDiagram1.DiagramElement.Load(), but it didn't work and I guess because xml structures of these two are poles a part!
1 Answer, 1 is accepted
RadTreeView and RadDiagram are semantically different controls and their save/load layout functionalities are not expected to be compatible. Hence, when you save the layout of one RadTreeView to xml, you can load it to another RadTreeView control as it has identical internal elements structure. But you can't load the treeview layout to RadDiagram.
The possible solution that I can suggest is to use the already stored treeview xml and load it to a dummy RadTreeView. Then, you can traverse the Nodes collection recursively and add the RadDiagramShapes programmatically:
https://docs.telerik.com/devtools/winforms/controls/diagram/populating-with-data
I hope this information helps.
Regards,
Dess | Tech Support Engineer, Principal
Progress Telerik
Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.
Rank 2
Iron
Veteran
OK then.
Surly if there isn't an easy XML solution to that, the only way would be iterating through a RadTreeView nodes collection in order to populate a RadDiagram.
But what is your suggestion on arranging the shapes (their positions) in a RadDiagram, corresponding to the hierarchy and structure of the nodes in RadTreeView? My main goal is to represent a RadTreeView nodes in form of a RadDiagram shapes and connections, in a logical visual manner.
Rank 2
Iron
Veteran
At the moment, I'm thinking of this solution :
ForEach n In RadTreeView1.Nodes
Dim shape1 AsNew RadDiagramShape() With {
.Text = n.Text,
.ElementShape = New RoundRectShape(4),
.BackColor = Color.LimeGreen
}
shape1.Position = New Telerik.Windows.Diagrams.Core.Point(n.Index * 100, 100)
shape1.Padding = New Padding(20, 20, 20, 20)
RadDiagram1.Items.Add(shape1)
Next
For Each n In RadTreeView1.Nodes
For x As Integer = 0 To n.Nodes.Count - 1
Dim shape2 As New RadDiagramShape() With {
.Text = n.Nodes(x).Text,
.ElementShape = New RoundRectShape(50),
.BackColor = Color.DarkRed
}
shape2.Position = New Telerik.Windows.Diagrams.Core.Point(n.Nodes(x).Index * 100, 300)
shape2.Padding = New Padding(20, 20, 20, 20)
RadDiagram1.Items.Add(shape2)
Next
Next
Hi, George,
The RadDiagramShape.Position property allows you to define the X,Y coordinates of the shapes. Thus, considering the RadTreeNode.Level, you can adjust the Y coordinate of the diagram shape and place the root nodes as top most located shapes and the nested nodes - as below located.However, the exact implementation of this custom requirement is up to the developer.
You can refer to our Demo application >> Diagram >> Organization Chart example which may be suitable for your scenario. The demo application is usually located in the installation folder of the suite:
C:\Program Files (x86)\Progress\Telerik UI for WinForms R2 2021\Examples\QuickStart\Bin
I hope this information helps.
Rank 2
Iron
Veteran
I tired using "RadTreeNode.Level" this time and below is my code.
For Each n In RadTreeView1.Nodes
Dim shape1 As New RadDiagramShape()
Dim shape2 As New RadDiagramShape()
shape1.Text = n.Text
shape1.ElementShape = New RoundRectShape(4)
shape1.BackColor = Color.Orange
shape1.Position = New Point(n.Index * 10, shape1.TreeLevel)
RadDiagram1.Items.Add(shape1)
For x As Integer = 0 To n.Nodes.Count - 1
shape2.Text = n.Nodes(x).Text
shape2.ElementShape = New RoundRectShape(50)
shape2.BackColor = Color.DarkRed
RadDiagram1.Items.Add(shape2)
Dim connection2 As New RadDiagramConnection() With {.Name = n.Nodes(x).Text}
connection2.Source = shape1
connection2.Target = shape2
RadDiagram1.Items.Add(connection2)
Next
Next
Dim settings As New Telerik.Windows.Diagrams.Core.TreeLayoutSettings() With {
.TreeLayoutType = Telerik.Windows.Diagrams.Core.TreeLayoutType.TreeDown,
.VerticalDistance = 20
}
settings.Roots.Add(Me.RadDiagram1.Shapes(0))
Me.RadDiagram1.SetLayout(Telerik.Windows.Diagrams.Core.LayoutType.Tree, settings)
I used "TreeLayoutType.TreeDown" to make the layout look like an organizational diagram.
The problem is that I have no idea how to iterate through all the sub nodes of a node which is also a sub node itself in the entire RadTreeView. I attached a pic that illustrates the issue. As you can see, my code doesn't cover nodes 5 and 6. Surely if there are other sub nodes to the nodes 5 or 6, they won't be covered either. Note that there might be any number of sub nodes in an entire RadTreeView, so I need to code it in such a way that all the nodes get covered. I appreciate your help to get me to a solution
You need to traverse the RadTreeView.Nodes collection recursively. You can refer to the following forum post which is quite useful on this topic:
https://www.telerik.com/forums/how-to-get-access-all-nodes-in-a-treeview
I believe that it would fit your needs.