1-> i need to increase the spacing between node but when i increase node spacing it only works on same level children the spacing between first child and parent remain the same for reference consider the following fig
i need spacing between alerts-allergy-agent code
2-> i need to make the main nodes that contain the tree to be of fixed size and induce scroll for overflow if it happens
right now the scroll is on the main div of diagram i need it to go away rather than the scroll in the 2 nodes in left and right for reference
the links are only connected to the main nodes outside the tree.
the problem is that if i try to link first and last of each tree it is not possible to do so cz of the difference between lengths of trees
consider a node in top of left tree which need to be mapped to a node in last of right tree and the right tree has 100 nodes in it
i will have to collapse all the node in right tree to get the last node in the same screen as of first node of left that is not optimal
so in order to avoid this i need to groups to be able to have fixed height and the data in it is scrollable
I thought you just said that links only connect with the groups, not with the nodes inside the groups. Perhaps I misunderstood what you meant by “main nodes outside the tree”.
And if you do have a link that connects the first node of the left group with the last node of the right group, one cannot see the whole link unless both nodes are in the viewport. Scrolling is one solution, but so is moving one group up or down.
Furthermore if you have a problem trying to show such a link (from left/first to right/last), you’ll still have a problem if there is also a link from left/last to right/first. You could not show such a link wholly within the viewport with either your scrolling suggestion or with the alternative of moving a group up or down – one or both nodes will be unseen.
Not without a lot of work. If you were just showing a list of Nodes within your Group, you could use the following code. But you have a tree, which makes it a lot harder when a parent node has scrolled off the top.
function ScrollingGroupLayout() {
go.Layout.call(this);
this._topIndex = 0;
this._spacing = 10;
this._count = 0;
this._lastIndex = 0;
}
go.Diagram.inherit(ScrollingGroupLayout, go.Layout);
ScrollingGroupLayout.prototype.cloneProtected = function(copy) {
go.Layout.prototype.cloneProtected.call(this, copy);
copy._topIndex = this._topIndex;
copy._spacing = this._spacing;
};
Object.defineProperty(ScrollingGroupLayout.prototype, "topIndex", {
get: function() { return this._topIndex; },
set: function(val) {
if (typeof val !== "number") throw new Error("new value for ScrollingGroupLayout.topIndex is not a number: " + val);
if (this._topIndex !== val) {
this._topIndex = val;
this.invalidateLayout();
}
}
});
Object.defineProperty(ScrollingGroupLayout.prototype, "spacing", {
get: function() { return this._spacing; },
set: function(val) {
if (typeof val !== "number") throw new Error("new value for ScrollingGroupLayout.spacing is not a number: " + val);
if (this._spacing !== val) {
this._spacing = val;
this.invalidateLayout();
}
}
});
Object.defineProperty(ScrollingGroupLayout.prototype, "count", {
get: function() { return this._count; }
});
Object.defineProperty(ScrollingGroupLayout.prototype, "lastIndex", {
get: function() { return this._lastIndex; }
});
ScrollingGroupLayout.prototype.doLayout = function(coll) {
var diagram = this.diagram;
var group = this.group;
if (group === null) throw new Error("ScrollingGroupLayout must be a Group.layout, not a Diagram.layout");
if (diagram !== null) diagram.startTransaction("Scrolling Group Layout");
this.arrangementOrigin = this.initialOrigin(this.arrangementOrigin);
var arr = [];
// can't use Layout.collectParts here, because we're intentionally making some
// member nodes not visible, which would normally prevent them from being laid out
var it = group.memberParts.iterator;
while (it.next()) {
var part = it.value;
if (part instanceof go.Link) continue;
part.ensureBounds();
arr.push(part);
}
this._count = arr.length;
//?? ought to support custom sort ordering
var x = this.arrangementOrigin.x;
var y = this.arrangementOrigin.y;
var maxy = y + group.resizeObject.height - group.placeholder.padding.bottom;
var i = 0;
var last = -1;
while (i < arr.length && i < this.topIndex) {
var part = arr[i++];
part.visible = false;
part.moveTo(x, y);
}
while (i < arr.length && y < maxy) {
var part = arr[i++];
part.moveTo(x, y);
if (y + part.actualBounds.height < maxy) {
part.visible = true;
y += part.actualBounds.height + this.spacing;
last = i - 1;
} else {
part.visible = false;
break;
}
}
while (i < arr.length) {
var part = arr[i++];
part.visible = false;
part.moveTo(x, y);
}
this._lastIndex = last;
var up = group.findObject("UP");
if (up !== null) up.visible = this.lastIndex < this.count - 1;
var down = group.findObject("DOWN");
if (down !== null) down.visible = this.topIndex > 0;
if (diagram !== null) diagram.commitTransaction("Scrolling Group Layout");
};
// end of ScrollingGroupLayout
