Three.js 从场景中拾取几何体，并一起删除几何体及其线框

我想添加和删除几何体及其线框。我可以使用光线投射器从场景中拾取对象，但很难拾取线框

我可以想到的一种方法是创建一组对象及其线框，当光线投射器与对象相交时（例如obj.geometry.type==“BoxGeometry”），找到其父对象并删除父对象。但是，线框必须是一些可以作为子对象添加的几何体。我正在使用Boxhelper为立方体创建线框，它应该直接添加到场景中，而不是作为子对象添加到任何对象中。解决这个问题的好方法是什么

---

谢谢。

我不确定我是否理解您的确切目的，但也许您可以创建对象的克隆，并将其渲染为线框。然后可以将克隆线框对象作为子对象添加到原始对象中。因此，拾取原始对象时，可以将其从场景中移除，然后线框对象也将被移除

克隆对象并将其材质更改为线框：

var wireframe = cube.clone();
wireframe.material = new THREE.MeshBasicMaterial({color: 0xff0000, wireframe: true});
cube.add( wireframe ); // adding wireframe as child to the cube

拾取对象时：检查对象是否为立方体测量（如果您只希望它处理立方体），并检查其材质是否为线框（如果您不希望在不移除立方体的情况下移除线框）

工作示例：

var scene=new THREE.scene（）；
var摄像机=新的三透视摄像机（75，window.innerWidth/window.innerHeight，0.11000）；
var renderer=new THREE.WebGLRenderer（）；
renderer.setSize（window.innerWidth、window.innerHeight）；
document.body.appendChild（renderer.doElement）；
var geometry=新的3.BoxGeometry（1,1,1）；
var material=new THREE.MeshBasicMaterial（{color:0x00ff00}）；
var cube=新的三个网格（几何体、材质）；
场景.添加（立方体）；
var wireframe=cube.clone（）；
wireframe.material=new THREE.MeshBasicMaterial（{color:0xff0000，wireframe:true}）；
添加（线框）；
//捡东西
var raycaster=new THREE.raycaster（）；
var mouse=new THREE.Vector2（）；
鼠标单击功能（事件）{
//在标准化设备坐标中计算鼠标位置
//两个组件的-1到+1
mouse.x=（event.clientX/window.innerWidth）*2-1；
mouse.y=-（event.clientY/window.innerHeight）*2+1；
//使用相机和鼠标位置更新拾取光线
raycaster.setFromCamera（鼠标、相机）；
//计算与拾取光线相交的对象
var intersects=raycaster.intersectObjects（scene.children）；
对于（变量i=0；i
还有一种方法可以使用
Three.EdgesHelper
而不是像fiddle中所示的克隆。这显示了没有对角线的线框

即使您不想使用
Three.edgeHelper
，我也注意到，在实现上述克隆解决方案时，并没有完全显示线框，因为它稍微隐藏了一点

为了避免这种隐藏，我在
材质的构造函数中添加了以下代码，它稍微偏移了原始形状，以便可以完全看到线框：

var material = new THREE.MeshLambertMaterial({ polygonOffset: true, polygonOffsetFactor: 1, polygonOffsetUnits: 1 })

我希望这是有用的。
酷，我不知道“克隆人”能做到这一点！！谢谢@micnil。那是解决我问题的好办法。但是，我不想渲染对角线。我想出了另一个“不聪明”的方法，仍然使用boxhelper并按其id移除，因为它将始终是网格id+1。好吧！是的，这种方法只能处理三角形线框。如果你希望线框的形状比立方体更复杂，这是一种很好的方法。很好，你让它工作了！
var material = new THREE.MeshLambertMaterial({ polygonOffset: true, polygonOffsetFactor: 1, polygonOffsetUnits: 1 })