OrganizationalChart - Diagram spread too widely

[Seetha]

Hi Team,

We've org chart with horizontal orientation but it exhibits too wider. Would you please assist how to reduce this horizontal spacing.?

Attachment: StockDiagramHistory_ddba348d.zip

[Senthil Kumar Venkatesan]

Hi Team , 

Our diagram control have a property called HorizontalSpacing and verticalSpacing which will be used to alter the layout spacing . And also we have “DiagramFitOptions “ which fit the diagram to the page with respect to mode and region . Please refer the below documentation link for the further reference . 

  

R 

Documentation link : https://blazor.syncfusion.com/documentation/diagram/layout/hierarchical-layout/#spacing 

Regards ,  

Senthil Kumar V 

[Seetha]

Hi Senthil,

The suggested settings made in the diagram but still the nodes/cards are appearing too wider.  The nodes were organized nicely(highlighted with green box) when a node has more parent and child nodes combination. It spreads too widely(scribbled in blue) when it has less child nodes.  

The following settings we've tried:       

#1 Fit2Page

 <DiagramPageSettings>

            <DiagramFitOptions CanFit="true" Mode="@FitModes.Width" CanZoomIn="true"></DiagramFitOptions>

        </DiagramPageSettings>

#2 Tried the scroll settings by having and removing - both result in no luck. ( and also tried with scrollArea too but not reducing the space)

        <DiagramScrollSettings HorizontalOffset="10" VerticalOffset="10" ScrollLimit="ScrollLimit.Limited"></DiagramScrollSettings>

#3 Layout settings - horizontal spacing

LayoutValue = new DiagramLayout()

            {

                ///Type = LayoutType.ComplexHierarchicalTree,

                Type = LayoutType.OrganizationalChart,

                //Margin = new LayoutMargin() { Top = .5 },

                VerticalSpacing = 40,

                HorizontalSpacing = 5,

                //EnableAnimation = false,

                HorizontalAlignment = HorizontalAlignment.Left,

                Orientation = LayoutOrientation.TopToBottom,

                //Arrangement = ChildArrangement.Nonlinear,

                LayoutInfo = new TreeInfo()

                {

                    //Create the layout info

                    CanEnableSubTree = false,

                    //Specify the sub-tree orientation

                    Orientation = SubTreeOrientation.Horizontal

                }

            };

Please assist and suggest to shrink the extra space.

First part of diagram:

Second part of the diagram: 

[Gowtham Gunashekar]

Hi Seetha, 

 

We cannot reproduce the reported issue at our end with the provided details. So please share us a more details of your requirements i.e. provide a simple sample with issue replication steps. This will be helpful to use to serve you better. 

 

Regards, 

Gowtham.