Line routing not working

[Mohammed Danish]

Hi,

I am adding nodes and connectors dynamically to the diagram  and assigning diagram to layout "ComplexHiearchicalTree".

But some connectors are going through the node and not around it .

I tried adding LineRouting constraints but it does not have any effect

Code flow:

1)looping through json and add nodes and connectors.

2)adding connectors by using sourceId and tragetId.

3)apply layout t diagram.

4)apply constraints to diagram using ths.diagram.constraints=myConstraints

5)applying databind() to diagram

6)Also injected LineRouting and ComplexHierarchicalTree

Attached a sample flow diagram for you to understand what i want to acheive

Thanks,

Danish Merchant

Attachment: FlowDiagram_b7ad38bf.rar

[Mohammed Danish]

Also, when we add constraints to diagram we are not able to select any connectors or nodes or move the same..

Thanks,

Danish Merchant

[Aravind Ravi]

Hi Mohammed, 

 

We suspect that you does not use LineRouting constraints in the diagram. So that connectors gets overlapped with node in the layout. Please find the below code snippet of how do to set line routing in the diagram.  

 

//TS 

public constraints: DiagramConstraints = DiagramConstraints.Default | DiagramConstraints.LineRouting; 

 

//HTML 

<ejs-diagram #diagram id="diagram" width="100%" height="700px" [getConnectorDefaults]='connDefaults' [getNodeDefaults]='nodeDefaults' [layout]='layout' [dataSourceSettings]='data' [tool]='tool' [snapSettings]='snapSettings' [constraints]=”constraints”> 

            </ejs-diagram> 

 

 

In the diagram if you set diagram tool as ZoomPan means then you cannot able to move the node or connector in the diagram, you can only able to zoom the diagram. So if you set diagram tool as ZoomPan means then change it as diagram tool as Default. So that you can able to move or resize the nodes in the diagram. 

 

//TS 

public tool: DiagramTools =  DiagramTools.Default 

 

//HTML 

<ejs-diagram #diagram id="diagram" width="100%" height="700px" [getConnectorDefaults]='connDefaults' [getNodeDefaults]='nodeDefaults' [layout]='layout' [dataSourceSettings]='data' [tool]='tool' [snapSettings]='snapSettings' [constraints]=”constraints”> 

            </ejs-diagram> 

 

 

In case if the issue still persists, please share us a simple sample illustrating issue. This would help us to serve you better. 

 

Regards 

Aravind Ravi