My main goal here is to achieve the "Directed Edges" (ones that combine) shown in this link: http://docs.yworks.com/yfileshtmlv2/#/api/yfiles.orthogonal.DirectedOrthogonalLayouter
To do this, I'm using yfiles for HTML and I am attempting to a DirectedOrthagonalLayout on my graph while maintaining all my node's positions, here's some description of what I've been doing (Note: I have DirectedOrthagonalLayout working in the case where it rearranges my nodes):
1. Adding all my nodes to graph with fixed position
graph.createNodeWithBoundsAndTag(new yfiles.geometry.RectD(x, y, wid, hei), item);
2. Adding some edges
var egMap = new yfiles.model.DictionaryMapper();
edge = graph.createEdge(nodeFrom, nodeTo);
graph.mapperRegistry.addMapper(yfiles.graph.IEdge.$class, yfiles.lang.Object.$class, yfiles.layout.PortConstraintKeys.TARGET_GROUP_ID_DP_KEY, egMap);
3. Use Layouter
var layouter = new yfiles.orthogonal.DirectedOrthogonalLayouter();
Result: Layout works, but all my nodes are moved.
I've tried layouter.useSketchDrawing = true; and it helps a bit, but not enough. I also tried moving my node to their correct location after using graph.setCenter(node, point); but I lost the edges lose their nice shapre and become diagonal. My questions are:
1. Is there a way I can apply a "best effort" DOLayout wihtout moving my nodes?
2. Is there another way to get a "Directed Edge" without using DirectedOrthogonalLayouter?
3. Is there a way I can move my nodes after applying DOLayout while maintaining the same node style? (when I drag and drop on my UI is maintains a nice style, but setCenter does not)
I thought this might help:
but it seems its not available to DOLayouts