Skip to content

Commit ff20fc3

Browse files
KarkuvelRajanKarkuvelRajan
authored
Merge pull request #47 from SriRam4552/1007315-Layout
1007315: Automatic layout and Complex hierarchy tree
2 parents 8f4f02a + d560b49 commit ff20fc3

10 files changed

Lines changed: 156 additions & 156 deletions

‎Diagram/Server/Pages/Layout/BasicLayout.razor‎

Lines changed: 20 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
@page "/BasicLayout"
22
@using Syncfusion.Blazor.Diagram
33

4-
<SfDiagramComponent Height="600px" Nodes="@nodes" Connectors="@connectors" NodeCreating="@OnNodeCreating" ConnectorCreating="@OnConnectorCreating">
5-
<Layout Type="LayoutType.HierarchicalTree" @bind-HorizontalSpacing="@HorizontalSpacing" @bind-VerticalSpacing="@VerticalSpacing">
4+
<SfDiagramComponent Height="600px" Nodes="@_nodes" Connectors="@_connectors" NodeCreating="@OnNodeCreating" ConnectorCreating="@OnConnectorCreating">
5+
<Layout Type="LayoutType.HierarchicalTree" @bind-HorizontalSpacing="@_horizontalSpacing" @bind-VerticalSpacing="@_verticalSpacing">
66
</Layout>
77
<SnapSettings>
88
<HorizontalGridLines LineColor="white">
@@ -15,12 +15,12 @@
1515
@code
1616
{
1717
//Defines diagram's connector collection.
18-
private DiagramObjectCollection<Connector> connectors = new DiagramObjectCollection<Connector>();
18+
private DiagramObjectCollection<Connector> _connectors = new DiagramObjectCollection<Connector>();
1919
//Defines diagram's node collection.
20-
private DiagramObjectCollection<Node> nodes = new DiagramObjectCollection<Node>();
21-
private LayoutType type = LayoutType.ComplexHierarchicalTree;
22-
private int HorizontalSpacing = 50;
23-
private int VerticalSpacing = 50;
20+
private DiagramObjectCollection<Node> _nodes = new DiagramObjectCollection<Node>();
21+
private LayoutType _type = LayoutType.ComplexHierarchicalTree;
22+
private int _horizontalSpacing = 50;
23+
private int _verticalSpacing = 50;
2424

2525
private void OnNodeCreating(IDiagramObject obj)
2626
{
@@ -40,22 +40,22 @@
4040

4141
protected override void OnInitialized()
4242
{
43-
nodes = new DiagramObjectCollection<Node>()
43+
_nodes = new DiagramObjectCollection<Node>()
4444
{
45-
new Node() { ID="node1", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="CEO"} } },
46-
new Node() { ID="node2", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="COO"} } },
47-
new Node() { ID="node3", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="Marketing Head"} } },
48-
new Node() { ID="node4", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="Product Head"} } },
49-
new Node() { ID="node5", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="Customer Support Lead"} } },
50-
new Node() { ID="node6", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="Warehouse Manager"} } },
45+
new Node() { ID = "node1", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "CEO" } } },
46+
new Node() { ID = "node2", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "COO" } } },
47+
new Node() { ID = "node3", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "Marketing Head" } } },
48+
new Node() { ID = "node4", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "Product Head" } } },
49+
new Node() { ID = "node5", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "Customer Support Lead" } } },
50+
new Node() { ID = "node6", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "Warehouse Manager" } } },
5151
};
52-
connectors = new DiagramObjectCollection<Connector>()
52+
_connectors = new DiagramObjectCollection<Connector>()
5353
{
54-
new Connector() { ID="connector1", SourceID="node1", TargetID="node2" },
55-
new Connector() { ID="connector2", SourceID="node1", TargetID="node3" },
56-
new Connector() { ID="connector3", SourceID="node1", TargetID="node4" },
57-
new Connector() { ID="connector4", SourceID="node1", TargetID="node5" },
58-
new Connector() { ID="connector5", SourceID="node1", TargetID="node6" }
54+
new Connector() { ID = "connector1", SourceID = "node1", TargetID = "node2" },
55+
new Connector() { ID = "connector2", SourceID = "node1", TargetID = "node3" },
56+
new Connector() { ID = "connector3", SourceID = "node1", TargetID = "node4" },
57+
new Connector() { ID = "connector4", SourceID = "node1", TargetID = "node5" },
58+
new Connector() { ID = "connector5", SourceID = "node1", TargetID = "node6" }
5959
};
6060
}
6161
}

‎Diagram/Server/Pages/Layout/ComplexHierarchicalTree.razor‎

Lines changed: 17 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -2,8 +2,8 @@
22

33
@using Syncfusion.Blazor.Diagram
44

5-
<SfDiagramComponent Height="600px" Nodes="@nodes" Connectors="@connectors" NodeCreating="@OnNodeCreating" ConnectorCreating="@OnConnectorCreating">
6-
<Layout Type="LayoutType.ComplexHierarchicalTree" @bind-HorizontalSpacing="@HorizontalSpacing" @bind-VerticalSpacing="@VerticalSpacing">
5+
<SfDiagramComponent Height="600px" Nodes="@_nodes" Connectors="@_connectors" NodeCreating="@OnNodeCreating" ConnectorCreating="@OnConnectorCreating">
6+
<Layout Type="LayoutType.ComplexHierarchicalTree" @bind-HorizontalSpacing="@_horizontalSpacing" @bind-VerticalSpacing="@_verticalSpacing">
77
</Layout>
88
<SnapSettings>
99
<HorizontalGridLines LineColor="white" LineDashArray="2,2">
@@ -17,11 +17,11 @@
1717
{
1818

1919
//Initailize the diagram's nodes collection
20-
private DiagramObjectCollection<Node> nodes = new DiagramObjectCollection<Node>();
20+
private DiagramObjectCollection<Node> _nodes = new DiagramObjectCollection<Node>();
2121
//Initailize the diagram's connectors collection
22-
private DiagramObjectCollection<Connector> connectors = new DiagramObjectCollection<Connector>();
23-
private int HorizontalSpacing = 40;
24-
private int VerticalSpacing = 40;
22+
private DiagramObjectCollection<Connector> _connectors = new DiagramObjectCollection<Connector>();
23+
private int _horizontalSpacing = 40;
24+
private int _verticalSpacing = 40;
2525

2626
//Method to set node's default properties
2727
private void OnNodeCreating(IDiagramObject obj)
@@ -47,20 +47,20 @@
4747
protected override void OnInitialized()
4848
{
4949
//Initializing node and connectors.
50-
nodes = new DiagramObjectCollection<Node>()
50+
_nodes = new DiagramObjectCollection<Node>()
5151
{
52-
new Node() { ID="node1", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="node1"} } },
53-
new Node() { ID="node2", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="node2"} } },
54-
new Node() { ID="node3", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="node3"} } },
55-
new Node() { ID="node4", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="node4"} } },
56-
new Node() { ID="node5", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation{Content="node5"} } },
52+
new Node() { ID = "node1", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "node1" } } },
53+
new Node() { ID = "node2", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "node2" } } },
54+
new Node() { ID = "node3", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "node3" } } },
55+
new Node() { ID = "node4", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "node4" } } },
56+
new Node() { ID = "node5", Annotations = new DiagramObjectCollection<ShapeAnnotation>() { new ShapeAnnotation { Content = "node5" } } },
5757
};
58-
connectors = new DiagramObjectCollection<Connector>()
58+
_connectors = new DiagramObjectCollection<Connector>()
5959
{
60-
new Connector() { ID="connector1", SourceID="node1", TargetID="node4" },
61-
new Connector() { ID="connector2", SourceID="node2", TargetID="node4" },
62-
new Connector() { ID="connector3", SourceID="node3", TargetID="node4" },
63-
new Connector() { ID="connector4", SourceID="node4", TargetID="node5" },
60+
new Connector() { ID = "connector1", SourceID = "node1", TargetID = "node4" },
61+
new Connector() { ID = "connector2", SourceID = "node2", TargetID = "node4" },
62+
new Connector() { ID = "connector3", SourceID = "node3", TargetID = "node4" },
63+
new Connector() { ID = "connector4", SourceID = "node4", TargetID = "node5" },
6464
};
6565
}
6666
}

‎Diagram/Server/Pages/Layout/LineDistribution.razor‎

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,16 @@
33
@using Syncfusion.Blazor.Diagram
44

55
<SfDiagramComponent Height="600px" NodeCreating="@OnNodeCreating" ConnectorCreating="@OnConnectorCreating">
6-
<DataSourceSettings ID="Id" ParentID="ReportingPerson" DataSource="@DataSource"></DataSourceSettings>
7-
<Layout Type="LayoutType.ComplexHierarchicalTree" SamePoint="false" @bind-HorizontalSpacing="@HorizontalSpacing" @bind-VerticalSpacing="@VerticalSpacing">
6+
<DataSourceSettings ID="Id" ParentID="ReportingPerson" DataSource="@_dataSource"></DataSourceSettings>
7+
<Layout Type="LayoutType.ComplexHierarchicalTree" SamePoint="false" @bind-HorizontalSpacing="@_horizontalSpacing" @bind-VerticalSpacing="@_verticalSpacing">
88
</Layout>
99
</SfDiagramComponent>
1010

1111
@code
1212
{
1313
//Initializing layout.
14-
private int HorizontalSpacing = 40;
15-
private int VerticalSpacing = 50;
14+
private int _horizontalSpacing = 40;
15+
private int _verticalSpacing = 50;
1616

1717
//Creates node with some default values.
1818
private void OnNodeCreating(IDiagramObject obj)
@@ -43,20 +43,20 @@
4343
public List<string> ReportingPerson { get; set; }
4444
}
4545

46-
public object DataSource = new List<object>()
46+
private object _dataSource = new List<object>()
4747
{
48-
new ComplexHierarchical() { Id= "node11" },
49-
new ComplexHierarchical() { Id= "node12", ReportingPerson= new List<string>(){"node114" }},
50-
new ComplexHierarchical() { Id= "node13", ReportingPerson=new List<string>() {"node12" }},
51-
new ComplexHierarchical() { Id= "node14", ReportingPerson=new List<string>() {"node12"}},
52-
new ComplexHierarchical() { Id= "node15", ReportingPerson=new List<string>() {"node12" }},
53-
new ComplexHierarchical() { Id= "node116", ReportingPerson=new List<string>() {"node22","node12" }},
54-
new ComplexHierarchical() { Id= "node21"},
55-
new ComplexHierarchical() { Id= "node22", ReportingPerson=new List<string>() {"node114" }},
56-
new ComplexHierarchical() { Id= "node23", ReportingPerson=new List<string>() {"node22" }},
57-
new ComplexHierarchical() { Id= "node24", ReportingPerson=new List<string>() {"node22"}},
58-
new ComplexHierarchical() { Id= "node25", ReportingPerson=new List<string>() {"node22"} },
59-
new ComplexHierarchical() { Id= "node31"},
60-
new ComplexHierarchical() { Id= "node114", ReportingPerson=new List<string>() {"node11","node21","node31" }}
48+
new ComplexHierarchical() { Id = "node11" },
49+
new ComplexHierarchical() { Id = "node12", ReportingPerson = new List<string>() { "node114" } },
50+
new ComplexHierarchical() { Id = "node13", ReportingPerson = new List<string>() { "node12" } },
51+
new ComplexHierarchical() { Id = "node14", ReportingPerson = new List<string>() { "node12" } },
52+
new ComplexHierarchical() { Id = "node15", ReportingPerson = new List<string>() { "node12" } },
53+
new ComplexHierarchical() { Id = "node116", ReportingPerson = new List<string>() { "node22", "node12" } },
54+
new ComplexHierarchical() { Id = "node21" },
55+
new ComplexHierarchical() { Id = "node22", ReportingPerson = new List<string>() { "node114" } },
56+
new ComplexHierarchical() { Id = "node23", ReportingPerson = new List<string>() { "node22" } },
57+
new ComplexHierarchical() { Id = "node24", ReportingPerson = new List<string>() { "node22" } },
58+
new ComplexHierarchical() { Id = "node25", ReportingPerson = new List<string>() { "node22" } },
59+
new ComplexHierarchical() { Id = "node31" },
60+
new ComplexHierarchical() { Id = "node114", ReportingPerson = new List<string>() { "node11", "node21", "node31" } }
6161
};
6262
}

‎Diagram/Server/Pages/Layout/LinearArrangementLinear.razor‎

Lines changed: 18 additions & 18 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,16 @@
33
@using Syncfusion.Blazor.Diagram
44

55
<SfDiagramComponent Height="600px" NodeCreating="@OnNodeCreating" ConnectorCreating="@OnConnectorCreating">
6-
<DataSourceSettings ID="Id" ParentID="ReportingPerson" DataSource="@DataSource"></DataSourceSettings>
7-
<Layout Type="LayoutType.ComplexHierarchicalTree" LinearArrangement="true" @bind-HorizontalSpacing="@HorizontalSpacing" @bind-VerticalSpacing="@VerticalSpacing">
6+
<DataSourceSettings ID="Id" ParentID="ReportingPerson" DataSource="@_dataSource"></DataSourceSettings>
7+
<Layout Type="LayoutType.ComplexHierarchicalTree" LinearArrangement="true" @bind-HorizontalSpacing="@_horizontalSpacing" @bind-VerticalSpacing="@_verticalSpacing">
88
</Layout>
99
</SfDiagramComponent>
1010

1111
@code
1212
{
1313
//Initializing layout.
14-
private int HorizontalSpacing = 40;
15-
private int VerticalSpacing = 50;
14+
private int _horizontalSpacing = 40;
15+
private int _verticalSpacing = 50;
1616

1717
//Creates node with some default values.
1818
private void OnNodeCreating(IDiagramObject obj)
@@ -43,20 +43,20 @@
4343
public List<string> ReportingPerson { get; set; }
4444
}
4545

46-
public object DataSource = new List<object>()
46+
private object _dataSource = new List<object>()
4747
{
48-
new ComplexHierarchical() { Id= "node11" },
49-
new ComplexHierarchical() { Id= "node12", ReportingPerson= new List<string>(){"node114" }},
50-
new ComplexHierarchical() { Id= "node13", ReportingPerson=new List<string>() {"node12" }},
51-
new ComplexHierarchical() { Id= "node14", ReportingPerson=new List<string>() {"node12"}},
52-
new ComplexHierarchical() { Id= "node15", ReportingPerson=new List<string>() {"node12" }},
53-
new ComplexHierarchical() { Id= "node116", ReportingPerson=new List<string>() {"node22","node12" }},
54-
new ComplexHierarchical() { Id= "node21"},
55-
new ComplexHierarchical() { Id= "node22", ReportingPerson=new List<string>() {"node114" }},
56-
new ComplexHierarchical() { Id= "node23", ReportingPerson=new List<string>() {"node22" }},
57-
new ComplexHierarchical() { Id= "node24", ReportingPerson=new List<string>() {"node22"}},
58-
new ComplexHierarchical() { Id= "node25", ReportingPerson=new List<string>() {"node22"} },
59-
new ComplexHierarchical() { Id= "node31"},
60-
new ComplexHierarchical() { Id= "node114", ReportingPerson=new List<string>() {"node11","node21","node31" }}
48+
new ComplexHierarchical() { Id = "node11" },
49+
new ComplexHierarchical() { Id = "node12", ReportingPerson = new List<string>() { "node114" } },
50+
new ComplexHierarchical() { Id = "node13", ReportingPerson = new List<string>() { "node12" } },
51+
new ComplexHierarchical() { Id = "node14", ReportingPerson = new List<string>() { "node12" } },
52+
new ComplexHierarchical() { Id = "node15", ReportingPerson = new List<string>() { "node12" } },
53+
new ComplexHierarchical() { Id = "node116", ReportingPerson = new List<string>() { "node22", "node12" } },
54+
new ComplexHierarchical() { Id = "node21" },
55+
new ComplexHierarchical() { Id = "node22", ReportingPerson = new List<string>() { "node114" } },
56+
new ComplexHierarchical() { Id = "node23", ReportingPerson = new List<string>() { "node22" } },
57+
new ComplexHierarchical() { Id = "node24", ReportingPerson = new List<string>() { "node22" } },
58+
new ComplexHierarchical() { Id = "node25", ReportingPerson = new List<string>() { "node22" } },
59+
new ComplexHierarchical() { Id = "node31" },
60+
new ComplexHierarchical() { Id = "node114", ReportingPerson = new List<string>() { "node11", "node21", "node31" } }
6161
};
6262
}

‎Diagram/Server/Pages/Layout/LinearArrangementNonLinear.razor‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -3,16 +3,16 @@
33
@using Syncfusion.Blazor.Diagram
44

55
<SfDiagramComponent Height="600px" NodeCreating="@OnNodeCreating" ConnectorCreating="@OnConnectorCreating">
6-
<DataSourceSettings ID="Id" ParentID="ReportingPerson" DataSource="@DataSource"></DataSourceSettings>
7-
<Layout Type="LayoutType.ComplexHierarchicalTree" LinearArrangement="false" @bind-HorizontalSpacing="@HorizontalSpacing" @bind-VerticalSpacing="@VerticalSpacing">
6+
<DataSourceSettings ID="Id" ParentID="ReportingPerson" DataSource="@_dataSource"></DataSourceSettings>
7+
<Layout Type="LayoutType.ComplexHierarchicalTree" LinearArrangement="false" @bind-HorizontalSpacing="@_horizontalSpacing" @bind-VerticalSpacing="@_verticalSpacing">
88
</Layout>
99
</SfDiagramComponent>
1010

1111
@code
1212
{
1313
//Initializing layout.
14-
private int HorizontalSpacing = 40;
15-
private int VerticalSpacing = 50;
14+
private int _horizontalSpacing = 40;
15+
private int _verticalSpacing = 50;
1616

1717
//Creates node with some default values.
1818
private void OnNodeCreating(IDiagramObject obj)
@@ -43,7 +43,7 @@
4343
public List<string> ReportingPerson { get; set; }
4444
}
4545

46-
public object DataSource = new List<object>()
46+
private object _dataSource = new List<object>()
4747
{
4848
new ComplexHierarchical() { Id= "node11" },
4949
new ComplexHierarchical() { Id= "node12", ReportingPerson= new List<string>(){"node114" }},

0 commit comments

Comments
 (0)