drawio icon indicating copy to clipboard operation
drawio copied to clipboard

Inconsistent group rotation

Open FarSeeing opened this issue 1 year ago • 1 comments

Preflight Checklist

  • [x] I agree to follow the Code of Conduct that this project adheres to.
  • [x] I have searched the issue tracker for a feature request that matches the one I want to file, without success.

You must agree to search and the code of conduct. You must fill in this entire template. If you delete part/all or miss parts out your issue will be closed.

Describe the bug The rotaion of the groups is not consistent and depends on the way you do it. There are multiple reports already, so this one is just an attempt to summarize information.

To Reproduce Steps to reproduce the behavior:

  1. add several shapes,
  2. group them,
  3. try to rorate,
  4. see the result that depends on the way selected

Dragging roration handle for the group cell Seems to be the only proper way when all cells get rotated. Calls the mxVertexHandler.prototype.mouseUp method that in turn calls mxVertexHandler.prototype.rotateCell method. This one iterates all children:

var childCount = model.getChildCount(cell);

for (var i = 0; i < childCount; i++)
{
	this.rotateCell(model.getChildAt(cell, i), angle, cell);
}

Clicking roration handle Calls the (redefined) mxVertexHandler.prototype.rotateClick This one just modifies the group cell style:

this.state.view.graph.setCellStyles(mxConstants.STYLE_ROTATION, angle, [this.state.cell]);

**Via the Format panel (either by the input or by the "Rotate shape only by 90°" button) Handlers are defined in the ArrangePanel.prototype.addAngle method: For the input:

update = this.installInputHandler(input, mxConstants.STYLE_ROTATION, 0, 0, 360, '°', null, true);

Here the BaseFormatPanel.prototype.installInputHandler method is quite simple:

var cells = ui.getSelectionState().cells;
graph.setCellStyles(key, value, cells);

The things are more comlicated for the button:

btn = mxUtils.button(label, function(evt)
{
	ui.actions.get('turn').funct(evt);
})

Where the acction handler is defined in the Actions.prototype.init method:

this.put('turn', new Action(mxResources.get('turn') + ' / ' + mxResources.get('reverse'), function(evt, trigger)
{
	// Context menu click uses trigger, toolbar menu click uses evt
	var evt = (trigger != null) ? trigger : evt;

	graph.turnShapes(graph.getResizableCells(graph.getSelectionCells()),
		(evt != null) ? mxEvent.isShiftDown(evt) : false);
}, null, null, (mxClient.IS_SF) ? null : Editor.ctrlKey + '+R'));

&&Via the "Arrange - "Rotate shape only by 90°" menu item** Calls the same action as described in the previous method.

Via the "Arrange - Direction - Roration" menu item Again in the Actions.prototype.init method but in another way now:

var dlg = new FilenameDialog(ui, value, mxResources.get('apply'), function(newValue)
{
	if (newValue != null && newValue.length > 0)
	{
		graph.setCellStyles(mxConstants.STYLE_ROTATION, newValue);
	}
}, mxResources.get('enterValue') + ' (' + mxResources.get('rotation') + ' 0-360)');

Expected behavior All rotation methods are expected to behave similar. Probably the easiest way would be extracting the method somewhere and calling it from all places listed.

draw.io version (In the Help->About menu of the draw.io editor):

  • draw.io version 24.6.4

Desktop (please complete the following information):

  • OS: [e.g. iOS]
  • Browser [e.g. chrome, safari]
  • Browser Version [e.g. 22]

Smartphone (please complete the following information):

  • Device: [e.g. iPhone6]
  • OS: [e.g. iOS8.1]
  • Browser [e.g. stock browser, safari]
  • Version [e.g. 22]

I tested the problem in incognito/private mode with all browser extensions switched off, write "yes" below:

  • yes

Additional context Add any other context about the problem here.

FarSeeing avatar Jul 04 '24 13:07 FarSeeing

Rotating and scaling after grouping will cause confusion

hhzhaoheng avatar Jul 23 '24 10:07 hhzhaoheng

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. See the FAQ for more information.

github-actions[bot] avatar Mar 30 '25 11:03 github-actions[bot]

Wanted to mention that is issue is still present.

This issue seems like a duplicate of https://github.com/jgraph/drawio/issues/137 which is more general, but has less specific information.

Yodo9000 avatar Nov 07 '25 20:11 Yodo9000