THREE.JS Raycaster 和 JS "objects" 而不是网格

Question

我有一个关于 Raycaster 模型的问题。我理解这个想法以及它与我可以转换的网格相交的事实，但是例如，如果我创建具有内部 THREE.Object3D 的 JS 对象，该对象将网格分组（对于它们的 UI），我怎么知道当对象的相应实例被点击时？

想象一个按钮。这个按钮有几个特征和一个内部 _model 来保存它的 THREE.js 图形形式（假设一个 boxGeometry 和一个 textGeometry 构建这个按钮）。当按钮被添加到场景中时，它会将其 buttonInstance.getModel() 添加到场景中，并将自身添加到对象存储库中以保留对它的引用。

如果我想单击此按钮，我会创建一个光线投射器并从 "buttons"（表示此对象的 3D 对象或网格）数组中获取相交对象。

但是如何触发事件或与按钮实例本身交互？我有网格，但不知道如何 link 它与实例本身。

有线索吗？我在三个中搜索了很多关于光线投射的内容，但所有示例都与更改网格的颜色或位置有关。

    _raycaster.setFromCamera(new THREE.Vector2(0,0), _camera);
    _activeBtns = _raycaster.intersectObjects(_buttons, true);
    _activeBtns[0].object.parent.position.set(curPos.x, curPos.y, curPos.z-.2); // alter position of the Object3D that holds textMesh and BoxMesh

但是，如果所有按钮都有两个网格，而且一旦它们出现在场景中我就看不到识别它们的方法，我怎么知道哪个按钮是 'clicked'？

谢谢

d

Answer 1

@uhara，@WestLangley。最后，我选择通过网格在场景中的 uuid 'bind' 它们，因为抽象对象也可以访问网格。

THREE.JS Raycaster 和 JS "objects" 而不是网格

THREE.JS Raycaster and JS "objects" instead of meshes

javascript

3d

three.js

raycasting