Question

挑选和对象代码是最受欢迎的代码之一：

function Picking(event) {
var raycaster = new THREE.Raycaster();
event.preventDefault();
mouse.x = (event.clientX / renderer.domElement.clientWidth) * 2 - 1;
mouse.y = -(event.clientY / renderer.domElement.clientHeight) * 2 + 1;
raycaster.setFromCamera(mouse, camera);
var intersects = raycaster.intersectObjects(objects);
if (intersects.length > 0) {
    if (INTERSECTED != intersects[0].object) {

    }
} else {
     INTERSECTED = null;
}
}

描述：场景中有两个对象 - 立方体和球体。球体是第一个到相机，而立方体是第二个。 Sphere具有ID1和立方体ID2。拣货正在发挥作用。

问题：删除球体后（scene.remove（sphere））;拣选给出ID1，因此，看起来球体是不可见的。什么是problam？示例图片：Picture

此代码未给出结果：

for (i = sphere.children.length - 1; i >= 0 ; i--) {
       object = sphere.children[i];
       object.geometry.remove;
       object.material.remove;
       object.geometry.dispose();
       object.material.dispose();
       scene.remove(object);
       sphere.remove(object);
   }

或

recur(sphere);
    for (var i in objects) {
        objects[i].geometry.remove;
        objects[i].material.remove;
        objects[i].geometry.dispose();
        objects[i].material.dispose();
        scene.remove(objects[i]);
        sphere.remove(objects[i]);
    }

function recur(obj) {
  if (obj instanceof THREE.Mesh) {
    objects.push(obj);
  }

  for (var i in obj.children) {
    recur(obj.children[i]);
  }
}

添加对象的代码：

var ObjLoader = new THREE.ObjectLoader();
var ii;
var group = new THREE.Object3D();
var oldModel = scene.getObjectByName('group');
if (oldModel !== undefined) { scene.remove(oldModel); }

      ObjLoader.load("path/model.json", addModelToScene);
      group.name = "group";
      scene.add(group);


function addModelToScene(model) {
     recur(model);
    for (var i in objects) {
        objects[i].castShadow = true;
        objects[i].receiveShadow = true;
    }
    model.name = "ModelName";
    group.add(model)
 }

因此，.json模型由一些对象（1..n）组成; 这个.json模型被添加到组中。选择立方体的一侧（可能是材料）是可选择的，但不可移动。但是这个位置可以改变。

谢谢。

Answer 1

稍微更改拾取逻辑，在创建时将所有对象存储到数组中：

 /*var objects = [];
  var  group = new THREE.Object3D();
 create your mesh add to array*/
 objects.push(MyMesh);
 /*now we have a reference all the time in objects[0] , objects[1]*/
 objects[0].displose();   check syntax been a while*/

customMaterial = new THREE.ShaderMaterial( 
{
    uniforms: customUniforms,
    vertexShader: document.getElementById( 'vertexShader' ).textContent,
    fragmentShader: document.getElementById( 'fragmentShader' ).textContent,
    //wireframe: true,
    side: THREE.FrontSide 

}   );


function ground (){

var map = new THREE.PlaneGeometry(1024,1024, 128, 128);//Use planebufferGeo

map.dynamic = true;

_terrain = new THREE.Mesh(  map, customMaterial );

_terrain.material.needsUpdate = true;

_terrain.geometry.dynamic = true;

_terrain.geometry.vertexColors = true; 

_terrain.material.uvsNeedUpdate = true;

_terrain.geometry.normalsNeedUpdate = true;

_terrain.rotation.x = -Math.PI / 2;

objects.push(_terrain);

scene.add(_terrain );
}

所以我在一个采摘游戏类型的情况下使用它，我使用一个数组存储网格，我可以操纵顶点/面等编辑数组进行更改。这是一种比较事物和检查数据的简单方法。

function animate() {

var raycaster = new THREE.Raycaster();

raycaster.setFromCamera(mouse, camera);

var intersects = raycaster.intersectObjects(objects);

if ( intersects.length > 0 ) {
    var faceIndex = intersects[0].faceIndex;
    var obj = intersects[0].object;
    var geom = obj.geometry;
     //etc

删除后，Three.js选择对象

1 个答案: