如何将 Konvajs Transformer 附加到多个形状而不分组？

Posted 2023-03-25

【中文标题】如何将 Konvajs Transformer 附加到多个形状而不分组？

【英文标题】：How to attach the Konvajs Transformer to multiple shapes without groupping them?

【发布时间】：2020-06-17 05:16:08

【问题描述】：

我正在开发一个基于 Konvajs 的设计器工具项目，您可以在其中使用 MouseClick+CntrlKey 选择多个形状。

这个想法是，一旦选择了第一个形状，就会创建一个附加到它的 Transformer。如果您按住 CntrlKey 并单击其他形状，则 Transformer 将被更新（使用 forceUpdate()）以包含这些形状。

感谢this tutorial，我已成功将 Transformer 附加到一个新创建的临时组，在该组中，所有形状在被选中时都会被一一添加。一旦您清除选择，形状就会从该组中删除。

将形状添加到临时组的问题是，在形状仍在该组中时，您无法保持形状的原始 z-index，因此它们都被移到顶部。这就是为什么我试图找到一种方法将 Transformer 直接附加到多个形状而不将它们添加到组中。

任何帮助将不胜感激！提前致谢！

【参考方案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