如何在Snap SVG中取消组合元素

我正在使用Snap SVG构建编辑器。我有一个组标记与一些变换。我想取消组合。我尝试使用for循环将组中的元素添加到父项中，但是这些变换在未分组的元素中未按预期工作。如何在Snap SVG中取消组合元素

有人可以告诉我一种取消组合元素的方法吗？

请在这里找到JS Bin。

https://jsbin.com/jinita/edit?js,output

在这里，当我拖动黑色矩形，整个组也移动。当我放弃它时，我尝试取消它的组合，但转换不适用于该组。

PS：我不能叫拖（）组元素

来源

2016-07-25 Harikrishnan

您将需要追加将元素添加到父项（或其他项）中，但您需要将变换放在它上面。如果您可以在jsfiddle上提供一个示例转换的简单示例，我相信我们可以进一步提供帮助。 – Ian

我试图添加小提琴，但不工作：https://jsfiddle.net/harikk09/4p2jvs45/1/ – Harikrishnan

你需要包括jquery，另外我不确定它会允许远程下载jsfiddle。你可以尝试一个jsbin或者其他东西，看看它是否更好，如果你使用它，包括jquery（这很简单，我不确定你需要它）。 – Ian

的代码是有点混乱，因为它看起来像你正尝试将组添加到自身上，但我可能是误解了。我已经稍微修改了它，并通过ID选择了该组，以便知道它是正确的，而不是css选择器。

jsfiddle

我修改了转换的关键部分是该行...

item.transform(g.transform().localMatrix.toTransformString())

编辑：在这种情况下，你也许可以进一步缩短至

item.transform(g.transform())

这确保我们在从组中移除时获得组变换，并使用toTransformString（）将其转换（我不确定这完全必要，但往往似乎消除古怪）。

编辑：后问题已略有修改，它可能是你真正想要的全矩阵应用在这种情况下它会...

item.transform(item.transform().globalMatrix.toTransformString())

jsbin

来源

2016-07-26 15:18:03 Ian

谢谢您的回答。其实我不必删除现有的组（我只删除新创建的组）。我通过将文本标签添加到新创建的组中来更新JSBin，使其更加清晰。我正在做一些多选组的运动。这就是为什么我将元素添加到组中并拖动新组。 https://jsbin.com/jinita/edit?js,output – Harikrishnan

现在你可以看到团队正在移动，但是当我拆分它时，转换变得混乱了。这是真正的问题。对困惑感到抱歉。你能帮我解决吗？ – Harikrishnan

我补充了一点，你的意思是这样吗？您的矩形拖动代码存在一个错误，但我认为您只关注其他位。 – Ian

如何在Snap SVG中取消组合元素

回答

相关问题