Aframe：我如何链接实体，以便用户可以链接/取消链接实体，因此实体将动画在一起，并一起交互

Question

我如何将多个实体链接和取消链接，以便可以将它们动画化。

一个例子是有一小堆实体。当我单击该桩时，桩会散开并向上浮向用户，因此它不再是桩，而是一系列彼此分开很小距离的谨慎实体。

该桩存在3个实体A，B和C

如果我单击ID为A的实体，则它们都会缩放/定位/旋转回一堆。

如果我单击实体ID B，则所有实体都移到左侧。如果我单击实体C，则C离开桩，并且桩的运动不再与桩相关。

还有另外一个实体X，Y和Z

如果实体X，Y或Z在实体C附近，则实体C加入X，Y，Z桩。如果用户单击实体Z并将其拖动到实体A或B附近，则实体Z加入桩A和B，

因此，如果单击实体A，则A，B和Z将一起缩放，旋转和定位。

Answer 1

我相信核心问题是，假设了解到动画化/移动实体容器会移动其所有子代，以及如何侦听单击事件，那么如何在实体容器之间来回父实体化。这是一个容器：

<a-entity id="groupContainer" animation__position="..." animation__scale="..." animation__rotation="...">
  <a-entity class="child"></a-entity>
  <a-entity class="child"></a-entity>
  <a-entity class="child"></a-entity>
</a-entity>

还没有一种在DOM级别上重新父级A-Frame实体的干净方法，因为分离/重新附加将删除/重新初始化所有组件。您可以使用three.js将实体移出。

var someOtherContainer = document.getElementById('someOtherContainer').object3D;
var childToReparent = document.querySelector('#someChildToRemoveFromContainer');
someOtherContainer.add(childToReparent);