首页 > 解决方案 > AFRAME raytrace get reference of intersected entity

问题描述

I got a raycaster component attached to the vr controller entity:

 <a-entity id="righthand" 
          vive-controls="hand: right; " 
          oculus-touch-controls="hand: right;"
          controls-ui
          collider-check
       >
        <a-entity raycaster="objects: .collidable; showLine: true; far: 100; " line="color: blue; opacity: 0.5" ></a-entity>

</a-entity>

and I got an entity in the scene that will receive the raytrace events:

<a-entity id='myCube' class="collidable" position="0 1.25 -6"  obj-model="obj: #cube-obj; mtl: #cube-mtl" >
       </a-entity>

How do I get the id or any reference of the collided entity in the 'raycaster-intersected' event? I tried the following code, and nothing seems to contains this data:

AFRAME.registerComponent('collider-check', {
  dependencies: ['raycaster'],

  init: function () {
    this.el.addEventListener('raycaster-intersected', function (evt) {

      console.log(evt.detail.el);  // not here

      console.log(evt.detail.intersection); // not here

      console.log(evt.detail);// not here

      console.log('Player hit something!');
    });
  }
});

Thanks in advance.

---------Update-----------

@Piotr Adam Milewski answer is correct. The event to be listening is raycaster-intersection instead of raycaster-intersected. In that way you can loop an array of the intersected entities.

Is it possible to get the same result from raycaster-intersected ?? If that event is emitted on the intersected entity, then It should be possible to get its id and other properties.I dont think is ideal to loop over an array every time an intersection event occurs.

标签: javascriptaframe

解决方案


文档

  • raycaster-intersected在相交实体上发射。它包含有关光线投射实体和相交详细信息的信息。
  • raycaster-intersection在光线投射实体上发射,并包含相交实体的列表。

使用raycaster-intersection尝试访问evt.detail.els相交实体数组时。这里的例子


由于raycaster-intersected是在相交实体上发射的,因此您可以检测光线投射器是否触及您的目标。

target.addEventListener('raycaster-intersected', (e)=> { 
  // intersected, e.target contains the element
  // e.detail.getIntersection(e.target) contains info about the intersection
})

在这里拉小提琴。getIntersection() 在这里摆弄。


推荐阅读