In my case when I drag child node at the edge of group node, group node adjust its position. So to avoid that I set “computesBoundsAfterDrag: true” but by setting this to true it is still repositioning group node after drag.
When I set computesBoundsAfterDrag to false(default), group changes position while I drag child node.
When I set computesBoundsAfterDrag to true, group changes position after I drag child node.
What I want is that when I drag child node group should remain at its position. Can someone please help me this.
As GoJS Sized Groups -- Northwoods Software discusses, you probably want to have some object in the visual tree of the Group cover the area of the group. Use a Shape whose Shape.fill is not null so that the Group is pickable by the user.
One issue that is occurring only for first load after removing placeholder and using shape instead of it i.e. child nodes are going outside, can we manage that.
So you do depend on Placeholders after all. Maybe you want my other suggestion.
Try using some variation on the stayInGroup function used in the Swim Lanes samples or the example at DraggingTool | GoJS API
You’ll want to adapt that code depending on your node template.
This is my stayInGroup method, I didn’t adapt any changes for this,
function stayInGroup(part, pt, gridpt) {
// don't constrain top-level nodes
var grp = part.containingGroup;
if (grp === null) return pt;
// try to stay within the background Shape of the Group
var back = grp.findObject("ENTERPRISESHAPE");
if (back === null) return pt;
// allow dragging a Node out of a Group if the Shift key is down
//if (part.diagram.lastInput.shift) return pt;
var p1 = back.getDocumentPoint(go.Spot.TopLeft);
var p2 = back.getDocumentPoint(go.Spot.BottomRight);
var b = part.actualBounds;
var loc = part.location;
// find the padding inside the group's placeholder that is around the member parts
var m = (grp.placeholder !== null ? grp.placeholder.padding : new go.Margin(0));
// now limit the location appropriately
var x = Math.max(p1.x + m.left, Math.min(pt.x, p2.x - m.right - b.width - 1)) + (loc.x - b.x);
var y = Math.max(p1.y + m.top, Math.min(pt.y, p2.y - m.bottom - b.height - 1)) + (loc.y - b.y);
return new go.Point(x, y);
}
Another issue occurring for child nodes on decreasing size of group node, child nodes not following group node. Same also occurring on sizedGroupsResizable Groups example
What do you want to happen? There are many reasonable choices.
The member nodes could shift to stay inside. They could be scaled down too.
Or the resizing operation could limit where and how the user could resize. There are examples of this – look for customization of the DraggingTool.
Or some combination of both policies.
Note that you also have a choice whether to restrict the resizing continuously in real time or only at the end upon mouse-up, regardless of the above policies you choose.