Aframe 在放置事件时触发 raycaster答案

【问题标题】：Aframe fire raycaster on drop eventAframe 在放置事件时触发 raycaster
【发布时间】：2020-01-28 13:38:45
【问题描述】：

我正在尝试将对象从 React UI 拖放到 3D 场景中。

我可以捕获放置数据/位置等，我现在尝试在 RayCaster 中使用它来确定已放置的 3D 实体。

const handleDragStop = (e) => {
    console.log(e)

    const scene = document.getElementById('scene');
    const raycaster:any = scene.getAttribute("raycaster");
    const camera = AFRAME.scenes[0].camera;

    console.log(raycaster)
    console.log(AFRAME.scenes[0])

    const mouse = new window.THREE.Vector2();
    mouse.x = ( e.clientX / window.innerWidth ) * 2 - 1;
    mouse.y = - ( e.clientY / window.innerHeight ) * 2 + 1;
    raycaster.setFromCamera( mouse, camera );
    var intersects = raycaster.intersectObjects( scene.children );
    console.log(intersects)
};

RayCaster 的 Aframe 版本似乎没有 raycaster.setFromCamera() 函数，它不被识别为函数。

如何从 drop 事件中触发 raycaster？

编辑

我可以让它与新的 Raycaster 一起工作

const raycaster = new window.THREE.Raycaster();

新的问题是，如何让这个光线投射器使用与现有对象相同的对象？

谢谢

【问题讨论】：

标签： aframe

【解决方案1】：

要访问三个 raycaster，您必须在具有 raycaster 组件的实体上执行以下操作：

entityEl.components.raycaster.raycaster.setFromCamera(..);

确保您在latest A-Frame release

【讨论】：