ngokevin
ngokevin

Reputation: 13233

Access A-Frame element from three.js object3D

From A-Frame, you can access an entity's object3D with .object3D or .getObject3D(), is there a way to do the reverse, when you are working with three.js objects, to get the element an object belongs to? Perhaps adding the parent element to userdata?

Upvotes: 3

Views: 2929

Answers (2)

Flux
Flux

Reputation: 666

I wrote a small function that traverses upwards using traverseAncenstors and returns an element if there is one.

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

Upvotes: 0

ngokevin
ngokevin

Reputation: 13233

A-Frame attaches the entity to object3D as .el.

For example with an entity with a mesh:

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

It also attaches to the group object3D:

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

This is done during setObject3D().

For object3Ds that A-Frame does not directly manage and does not have a direct associated A-Frame entity, then we can walk up the scene graph to find the closest one with object3D.traverseAncestors.

Upvotes: 7

Related Questions