Prepend a Node in a Group

Hello, I need to handle dropping and prepending a Palette Node into an existing group. The append is working fine, the prepend not so much. Do you have documentation on how to go about this?

“gojs”: “~2.3.19”

Thank you,

Prependchildintogroup

Here’s my current code:

dModel.commit((m) => {
			const newChild = m.findNodeDataForKey(paletteNode.data.key);
			const group = m.findNodeDataForKey(targetNode.data.group);

			if (newChild && group) {
				m.set(newChild, 'state', GoJsNodeState.Diagram);
				m.set(newChild, 'isChild', true);
				m.set(newChild, 'group', targetNode.data.group);
				m.set(newChild, 'templateIndex', '-');

				if (targetNode.data.text.includes('Append')) {
					const appendNode = m.findNodeDataForKey(targetNode.data.key);

					// Append to array
					m.set(group, 'containsChildren', [
						...group.containsChildren,
						newChild,
					]);

					if (appendNode) {
						m.removeNodeData(appendNode);
						m.addNodeData({ ...appendNode });
					}
				} else {
					// Preppend to array
					m.set(group, 'containsChildren', [
						newChild,
						...group.containsChildren,
					]);
				}
			}
		});

The automatic positioning of nodes in a Group is determined by its Group.layout. So you just need to make sure that that layout puts them in the order that you want. Typically you’ll have some property on the node data objects that indicates the desired order, so your layout will have a comparer function that depends on that node.data.someProperty value.

1 Like