three.js를가 Raycaster

Question

내가 선택한 개체를 얻을 수있는 다음과 같은 기능을 데와 개체를 선택할 수 없습니다, 그래서 내 기능은 여기

function onMouseDown(event) { 
    console.log(event); 
    event.preventDefault(); 

    mouse.x = (event.clientX/window.innerWidth) * 2 - 1; 
    mouse.y = - (event.clientY/window.innerHeight) * 2 + 1; 
    // find intersections 

    var vector = new THREE.Vector3(mouse.x, mouse.y, 0.5); 
    projector.unprojectVector(vector, camera); 


    var pLocal = new THREE.Vector3(0, 0, -1); 
    var pWorld = pLocal.applyMatrix4(camera.matrixWorld); 
    var ray = new THREE.Raycaster(pWorld, vector.sub(pWorld).normalize()); 




    ray.set(camera.position, vector.sub(camera.position).normalize()); 
    var intersects = ray.intersectObjects(scene.children); 
    //console.log(intersects); 
    console.log(scene.children); 
    if (intersects.length > 0) { 

    var clickedObject = intersects[0].object; 

    console.log('objects '+intersects[ 0 ].object); 
    console.log('objects id'+intersects[ 0 ].object.id); 
    console.log('objects name'+intersects[ 0 ].object.name); 

    if (INTERSECTED != intersects[ 0 ].object) { 

    if (INTERSECTED) INTERSECTED.material.emissive.setHex(INTERSECTED.currentHex); 

    INTERSECTED = intersects[ 0 ].object; 
    console.log('INTERSECTED '+INTERSECTED); 
    INTERSECTED.currentHex = INTERSECTED.material.emissive.getHex(); 
    INTERSECTED.material.emissive.setHex(0xff0000); 

    } 

    } else { 

    if (INTERSECTED) INTERSECTED.material.emissive.setHex(INTERSECTED.currentHex); 

    INTERSECTED = null; 

    } 
} 

하지만 intersects에 빈 배열을 얻고, 난 내 레벨을 시도 최고의하지만 난

var loader = new THREE.JSONLoader();  
loader.load("uploads/accessories/3d/code/3dfile_"+file+".js", 
     function(geometry, object_material) 
     { 

      var object = new THREE.Mesh(geometry, new THREE.MeshFaceMaterial(object_material)); 
      model = new THREE.Object3D(); 
      model.id="Myid"+file; 
      model.name="Myname"+file; 
      model.userData ={ URL: "http://myurl.com" }; 
      model.add(object);  
      model.position.set(x,y,z);   
      model.scale.set(obj_width,obj_height,obj_rotation); 
      model.opacity =2; 
      model.rotation.y = 600; 
      model.duration = 12000; 
      model.mirroredLoop = true; 
      model.castShadow = true; 
      model.receiveShadow = true; 

      console.log(model); 
      var smodel=model; 
      scene.add(smodel);        
     } 
); 

지금 내가 원하는

여기 등 장면에 객체를 추가하는이시 이전에 현장 의 연결된 모든 개체를 볼 수있는 scene.children 콘솔 있다면, 여기에 어떤 해결책을 찾을 수 없습니다 추가 된 모델을에 가져옴 onMouseDown에있는하지만 아무도 동일한 문제가 있습니까?

Answer 1

recursive 플래그를 Raycaster.intersectObjects()에 전달해야합니다.

intersects = ray.intersectObjects(scene.children, true); 

또한 Object3D.id을 덮어 쓰지 마십시오. 대신 Object3D.userData.id을 설정하십시오.

three.js를 r.68

Answer 2

에 한번이 example을 통해 확인합니다. 콘솔의 메시지를보십시오.

<script src="js/controls/EventsControls.js"></script> 

EventsControls = new EventsControls(camera, renderer.domElement); 
EventsControls.draggable = false; 

EventsControls.onclick = function() { 

    console.log(this.focused.name); 

} 

var jsonLoader = new THREE.JSONLoader(); 
jsonLoader.load("models/Tux.js", addModelToScene); 


function addModelToScene(geometry, materials) { 

    var material = new THREE.MeshFaceMaterial(materials); 
    model = new THREE.Mesh(geometry, material); 
    model.scale.set(10, 10, 10); model.name = 'Tux'; 
    model.rotation.x = -Math.PI/2; 
    model.position.set(175, 45, 125); 
    scene.add(model); 
    EventsControls.attach(model); 

} 

Answer 3

잡을 수있는 16 진수가없는 MeshFaceMaterial을 사용 중입니다. 당신은 너무 같은 '물질'에서 '물질의 배열'을 얻을 수 있습니다

for(var p =0; p < INTERSECTED.material.materials.length; p++){ 
    INTERSECTED.currentHex = INTERSECTED.material.materials[p].emissive.getHex(); 
} 

이 방법은 당신이 MeshFaceMaterial하지만 각면에 사용하는 MeshLambertMaterial 또는 MeshBasicMaterial을 선택하지 않습니다. 이미지를 텍스처로 사용하는 경우 해당 질문에 대한 빠른 대답을 확인하려면 Three.js material texture and color을 확인하는 것이 좋습니다.

희망이있었습니다.