从 three.js object3D 访问 A-Frame 元素答案

【问题标题】：Access A-Frame element from three.js object3D从 three.js object3D 访问 A-Frame 元素
【发布时间】：2016-11-29 06:41:42
【问题描述】：

从A-Frame，您可以使用.object3D 或.getObject3D() 访问实体的object3D，当您使用three.js 对象时，有没有办法反过来获取对象所属的元素?也许将父元素添加到userdata？

【问题讨论】：

标签： three.js aframe

【解决方案1】：

A-Frame 将实体作为.el 附加到object3D。

例如带有网格的实体：

document.querySelector('a-entity').getObject3D('mesh').el;

它还附加到组object3D：

document.querySelector('a-entity').object3D.el;

这是在setObject3D() 期间完成的。

对于object3Ds，A-Frame 不直接管理并且没有直接关联的A-Frame 实体，那么我们可以沿着场景图向上查找与object3D.traverseAncestors 最接近的一个。

【讨论】：

并非所有实体都有网格，但您可以随时使用document.querySelector('a-entity').object3D.el

【解决方案2】：

我写了一个小函数，使用 traverseAncenstors 向上遍历，如果有则返回一个元素。

function getParentEl( o ){
  let p;
  o.traverseAncestors( function( a ){
    if( p === undefined && a.el ){
      p = a;
    }
  });
  if( p ){
    return p.el
  }
  return;
}

【讨论】：