Как прикрепить трансформатор Konvajs к нескольким формам, не склеивая их?

Question

Я работаю над проектом дизайнерского инструмента на основе Konvajs, где вы сможете выбирать несколько фигур с помощью MouseClick+CntrlKey.

Идея состоит в том, что после выбора первой формы создается и прикрепляется к ней Трансформер. Если вы удерживаете CntrlKey и щелкаете по другим фигурам, Transformer будет обновлен (с помощью forceUpdate()), чтобы включить их тоже.

Благодаря этому руководству мне удалось прикрепить Transformer к недавно созданной временной группе, в которую все формы добавляются одна за другой, когда они выбираются. Как только вы снимете выделение, фигуры будут удалены из этой группы.

Проблема с добавлением фигур во временную группу заключается в том, что вы не можете сохранить исходный z-индекс фигур в течение того времени, пока они все еще находятся в этой группе, поэтому все они перемещаются наверх. Вот почему я пытаюсь найти способ прикрепить Трансформер к нескольким фигурам напрямую, не добавляя их в группу.

Любая помощь будет оценена по достоинству! Заранее спасибо!

Answer 1

Из konva@5.0.0 возможно присоединение нескольких узлов:

const tr = new Konva.Transformer();
layer.add(tr);

tr.nodes([shape1, shape2]);
layer.draw();

https://konvajs.org/docs/select_and_transform/Basic_demo.html