I'm currently trying to display a process flow with Cytoscape.js and cytoscape-dagre. While this combination does a pretty good job for simple processes (or graphs), I can't solve the problem of edges crossing nodes.
The following is rendered by the dot engine of GraphViz. Have a look at the path between "QS-Daten anlegen" and "Buchhaltungsdaten anlegen": Nodes positioned in a straight line, edges avoiding to cross nodes.
The same graph rendered by cytoscape.js and cytoscape-dagre. Nodes are position similar, but not in such a straight line. Edges don't consider node positions.
I tried to improve the result by adjusting the lyout options like nodeSep
, edgeSep
etc. But the main problem remains: single lines between nodes don't consider other nodes being positioned on the straight path of that edge.
I'm not sure if that is a matter of the layout algorithm, i. e. cytoscape-dagre or if cytoscape.js simply doesn't allow layout plugins to bend edges.
And of course, I don't know how to let cytoscape render that graph like the dot engine of GraphViz does.
Thanks in advance Newlukai