RadialTree: Nodes & connectors overlapping issue.

[Doug]

Hi,

Please find attached a sample project to demonstrate the overlapping issue. 

The issue can be reproduce easily with following conditions:

1) Parent node has only 1 child node.

2) The child node above has many children nodes.

Results, please help to fix or advice what can I do to fix the issues: 

1) Connectors overlap the nodes ==> please advise how to make connectors go below the nodes?

2) Parent node & children nodes overlapped ==> this could be fix somehow by adjusting  horizontalSpacing and  verticalSpacing

Best Regards,

Attachment: RadialTreeSample_fae741da_b0069c23.zip

[Gowtham Gunashekar]

Hi Doug, 

 

 

On the further analysis of the shared sample, we found that the parent root node has only one child and that child node “CEO” has multiple children. Our radial tree automatically layout algorithm places the children nodes around the parent node in a circular manner. In your case, the root parent has only one child and the parent's first child have multiple children, so all the nodes are arranged circularly around the “CEO” node and some connectors overlap over the parent root node. We suggest you position the root parent node programmatically using the dataLoded event. We have added the suggested changes to the shared sample and added them below for your reference.  

   

 

Code snippet: 

 

        function dataLoaded() { 

            var diagram = document.getElementById("diagram").ej2_instances[0]; 

            diagram.nodes[0].offsetX -= 200; 

            diagram.nodes[0].offsetY -= 600; 

            diagram.dataBind(); 

            diagram.fitToPage(); 

        } 

 

 

Sample link: https://www.syncfusion.com/downloads/support/directtrac/general/ze/RadialTreeSampleLatest1412521009.zip 

 

 

Regards  

Gowtham