Closed luxzeitlos closed 4 years ago
From the api reference
A column width accessor takes a column index and returns the relative width of the column.
Setting the columnWidth
changes the scale between the width and the separation of columns, so you should see the columns get slightly closer together. If you want to change the width of the layout, try changing the size.
@luxferresum adjusting columnWidth
in conjunction with columnSeparation
(as well as size
, as @erikbrinkman pointed out) will help you get consistent widths across dynamic graphs
What I try to accomplish is to prevent overlappings while trying to keep the graph as compact as possible. However I always have overlappings, except when I specify size
that big that the graph becomes extremely streched out.
This is the code of this example:
const arq = arquint();
arq.size([this.width, this.height / 2]);
arq.columnWidth(() => 250);
arq.columnSeparation(() => 10);
arq.columnAssignment(columnAdjacent().center(true))
arq.layering(layeringCoffmanGraham())
dag.descendants().forEach(n => n.heightRatio = .1);
arq(dag);
this.nodes = dag.descendants();
The rectangles are basically width="250" height="20"
, while top center is at x0, y0
.
So I would expect no overlap (because arq.columnWidth(() => 250);
), but I do have overlap. :(
It doesn't look like your nodes have varying height to them. Is there a reason you're using arquint? Since arquint nodes have varying height, they're assigned to columns that must have uniform width. If you were to use sugiyama
, there is support for a separation function that allows for specifying node width.
I'm going to close this absent any movement in the past 9 months, but if you're still having issues, feel free to reopen.
not sure why.
arq.columnWidth(() => 100);
returns the same asarq.columnWidth(() => 1);
.