How to change the position of transformer rotation icon

Viewed 822
1 Answers

At the current moment (konva@4.0.16) that is not possible to do directly with Konva API. But you can make a workaround by placing a shape inside the rotated group.

const group = new Konva.Group({
  x: stage.width() / 2,
  y: stage.height() / 2,
  rotation: 90
});
layer.add(group);

const shape = new Konva.Rect({
  rotation: -90,
  width: 100,
  height: 50,
  fill: 'green'
});
group.add(shape);

const tr = new Konva.Transformer({
  node: group
})
layer.add(tr);

But in this case, tracking the absolute position of a shape is more complex. Because Konva.Transformer will change attributes of the group, not the shape.

https://jsbin.com/peqinuzuqi/1/edit?html,js,output

Related