How to drag group?

@tiepna wrote:

Hi,
That box below making by group object and properties is node object.

I cannot drag box if mouse focus to properties inside table.
Is there anyway to drag this box if mouse focus at properties.

here is group template and node template in my graph

var groupTempl = $(go.Group, "Auto",
			{
				fromSpot: go.Spot.AllSides,
				toSpot: go.Spot.AllSides},
				new go.Binding("location", "", toLocation).makeTwoWay(fromLocation),
				new go.Binding("isSubGraphExpanded", "isExpanded").makeTwoWay(),
				$(go.Shape, "Rectangle",
					{ fill: "white", stroke: "#4472C4", strokeWidth: 2 }
				),
				$(go.Panel, "Vertical",
					{ margin: 5, defaultAlignment: go.Spot.Left },
					$(go.Panel, "Horizontal",
						$("SubGraphExpanderButton",
							{ alignment: go.Spot.Right, margin: 5, click: function(e, button) {
									var group = button.part;
									if (group instanceof go.Adornment)
										group = group.adornedPart;
									if (!(group instanceof go.Group))
										return;
									var diagram = group.diagram;
									if (diagram === null)
										return;
									var cmd = diagram.commandHandler;
									if (group.isSubGraphExpanded) {
										if (!cmd.canCollapseSubGraph(group))
											return;
										} else if (!cmd.canExpandSubGraph(group))
											return;
									e.handled = true;

									var linksToGroupOnly = group.findLinksConnected();
									var externalLinksConnected = group.findExternalLinksConnected();
									var externalNodesConnected = group.findExternalNodesConnected();

									diagram.startTransaction("expand-collapse");
									if (group.isSubGraphExpanded) {
										//show Group links, hide Node links
										cmd.collapseSubGraph(group);
										showGroupLinkGroup(externalLinksConnected,linksToGroupOnly);
									} else {
										//hide Group links, show Node links
										cmd.expandSubGraph(group);
										hideGroupLinkGroup(group,externalNodesConnected,externalLinksConnected,linksToGroupOnly);
									}
									diagram.commitTransaction("expand-collapse");
								}
							}
						),
						$(go.TextBlock,
							{
								alignment: go.Spot.Left,
								margin: 5,
								font: IGOV_GROUP_HEADER_FONT_STYLE,
								stroke: "#4472C4"
							},
							new go.Binding("text", "label"))
					),
					$(go.Placeholder,{padding:10})
				)
	);

	var fieldNodeTempl = $(go.Node, "Table",
			{ movable: false, selectionAdorned: false },
			new go.Binding("visible", "visible").makeTwoWay(),
			// icon
			$(go.Picture,
				{ desiredSize: new go.Size(15, 15), margin: new go.Margin(2,8,2,2), column: 0},
				new go.Binding("source", "icon")
			),
			// element
			$(go.TextBlock,
				{ stroke: "#333333",font: IGOV_ROW_FONT_STYLE, column: 1, alignment: go.Spot.Left },
				new go.Binding("text", "", function(data){return data.label;}),
				new go.Binding("isUnderline","isLinkExternal"),
				new go.Binding("font", "inforInherited", function (t){return  t ? "bold " + IGOV_ROW_FONT_STYLE : IGOV_ROW_FONT_STYLE})
			),
			$(go.TextBlock,
					{ stroke: "#333333",font: IGOV_ROW_FONT_STYLE, column: 2, alignment: go.Spot.Left },
					new go.Binding("text", "", function(data){return  " " + data.cardinality;}),
					new go.Binding("isUnderline","isLinkExternal"),
					new go.Binding("visible", "CardinalityOnFields").makeTwoWay(),
					new go.Binding("font", "inforInherited", function (t){return  t ? "bold " + IGOV_ROW_FONT_STYLE : IGOV_ROW_FONT_STYLE})
			),
			{toolTip:
				$(go.Adornment, "Auto",
					$(go.Shape, { fill: "#FFFFCC" }),
					$(go.TextBlock, { margin: 4 },
					new go.Binding("text", "inforInherited")),
					new go.Binding("visible", "inforInherited", function (t){return t ? true : false;}),
				),// end of Adornment
			}
	);

Posts: 2

Participants: 2

Read full topic