Open barrybecker4 opened 4 months ago
I found a workaround for doing what I want without needing to make any code change. I can use the existing "ui.points" attribute on a node in conjunction with the "cubic-curve" style. For my case, I just want to have the middle 2 (of the 4) points be the same value (my control point). It seems a little bit redundant to have to specify the first and last points in the list of 4 points because, as far as I know, they will always be the position of the source and target nodes of the edges, respectively.
My helper code to do what I want is
private void setEdgePoint(Edge edge, double x, double y) {
Object[] src = edge.getSourceNode().getAttribute("xyz", Object[].class);
Object[] dst = edge.getTargetNode().getAttribute("xyz", Object[].class);
edge.setAttribute("ui.points",
src[0], src[1], 0.0,
x, y, 0,
x, y, 0,
dst[0], dst[1], 0
);
}
Currently, when the edges of a graph are styled with
shape: cubic-curve;
they are curved in a seemingly arbitrary way and it rarely looks how I want. For example, here is a graph where the edges are styled withcubic-curve
: Note that there are discontinuities at the nodes because the Bezier control vectors are either horizontal or vertical and determined by the angle between the source and destination vertices.What I propose is a simple backward compatible change that would allow optionally specifying a control point for an edge that would determine the quadratic Bezier to use for its curvature like this:
If an edge has the "ui.control-point" attribute set, then the edge renderer will draw a quadratic Bezier curve using that control point. The implementation is simple, and will give a lot of extra control. I will make a PR.
After adding the control point, I can get the curved edges to look they way that I want.