害怕:我如何链接实体，以便用户可以链接/取消链接实体，这样实体就会一起动画化，并一起交互

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);