Moving the sub-diagrams in the diagram(TreeLayout) to another row

[Andrei]

Good afternoon.
We have a diagram (Tree Layout). Our diagram consists of separate sub-diagrams with no connection between them. Why does the last item automatically go to the second row (in the attach file, it is highlighted in red)? Could you tell me how this can be avoided? We need all the sub-diagrams to be placed in one line.

 

 

[Petar Mladenov]

Hello Andrei,

I guess, your sub-diagrams are connected components (there are no single shapes in them). Diagram layouts components in a virtual grid with default width of 1024 pixels, and if there is no enough space, the component is moved to the next row. You can increase this virtual size to double.MaxValue. The name of the property is ComponentsGridWidth in TreeLayoutSettings.

Regards,
Petar Mladenov
Progress Telerik

[Andrei]

Hallo Petar,

this is exactly what is needed. You've been very helpful, thank you very much.

Regards, Andrei Silich

[Andrei]

Hello Petar,

One more short question, is it possible to implement the diagram as in the picture?
This is similar to a combination of two chart options(Tree-down and Tree-up).

[Petar Mladenov]

Hi Andrei,

RadDiagram does not provide an API for layout processing over individual independent connected components with different settings (in your picture there are 3 independent components of shapes). However, I can list some helpful methods you can use, if you want to implement such requirement as an application logic:

           -   to get all components you can use the following code:

     Graph<TreeLayoutData, object> g = new Graph<TreeLayoutData, object>(this.diagram);
            var components = g.GetConnectedComponents();

          - in a single method, you can hide all components except the current one you want to layout. You can then layout the diagram with the specific settings and the single left component will be positioned on the top-left corner of your diagram. So this step can be repeated with different settings over different components left visible on the diagram

         - last but maybe the hardest one is to manually shift all independent components (once they are all visible) in a way that they do not overlap each other. Good news is that diagram provides helpful method which can give you the enclosing bounds of a list of shapes:

components.First().GetBoundingRectangle();

extension method:
new List<RadDiagramShape>() { new RadDiagramShape(), new RadDiagramShape()}.GetEnclosingBounds()

Regards,
Petar Mladenov
Progress Telerik

[Andrei]

Hello Petar,

Thank you for your answer, I will try to implement your solution.

One more short question,

when I add a new child element to the diagram(see attach file), the diagram automatically optimizes their layout. After the chart is updated, the new element and its parent are automatically moved to the left side. Is it possible to make them stay in their places?

[Petar Mladenov]

Hello Andrei,

I guess the scenario you describe is not exactly when you add a node but when the Layout function is invoked. The default value of the AutoLayout property is False, any chance you use it with True ?

On the specific layout you describe in the picture - yes, the tree layout first sorts the connected components first by decreasing number of their nodes which means subdiagrams with more items will be on the left of subdiagrams with less items. Then the second sort is decreasing by the width of the subdiagrams - wider diagrams are on the left. I am afraid there is no parameter of APi to control this behavior. However, you can submit a feature request in our portal where we will eventually approve it.

Regards,
Petar Mladenov
Progress Telerik

[Andrei]

everything is clear, thank you for your help.