Port Connection Direction

[ceds]

I have a custom shape as such below.

The port connection is defined where the line starts:

{

id: 'port3',

shape: 'Circle',

offset: {

x: 0.915,

y: 0.505

},

// constraints: {

// connectionDirection: 'Bottom'

// }

}

However, the connection needs to go "down". Not "right". A lot of fiddling with the interface can force it to do down, but then just moving the object around will make it right again.

How can I force the port to only connect "down"? I looked at constraints as given in the commented code above however it does not work.

UPDATE: It seems like this solution ( https://help.syncfusion.com/wpf/diagram/port/port#connection-direction  )is only available to WPF ?  Is there a way I can get this functionality in JS?

[Sivakumar Sekar]

Hi Franco, 

 

We have added the sample link to demonstrate how to create a port connection pointing always to the down. By default in the diagram, we don`t have support to add connection direction for connectors. We can able to render the port to port connection that will always be pointing towards down. We can create a target node along with the port positioned at the top center of the node, to be located below the custom-shaped node. So that the connector target will always pointing towards down.  

 

Sample link: https://stackblitz.com/edit/7ptndt?file=index.js  

 

Regards, 

Sivakumar