Intersección dentro de Object3D

Question

Tengo algunos objetos agregados a un Object3D (para agrupar elementos) e intento detectar clics en él. Mi escena tiene un tamaño de 600x400, mi cámara está dentro de un período de tres a objetos y mi código de controlador de eventos se parece a continuación:

function onDocumentMouseDown(event) { 
    event.preventDefault(); 

    var mouse = {}; 
    mouse.x = (event.clientX/600) * 2 - 1; 
    mouse.y = - (event.clientY/400) * 2 + 1; 

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

    var ray = new THREE.Ray(three.camera.position, vector.subSelf(three.camera.position).normalize()); 

    var intersects = ray.intersectObjects(group.children); 
    alert(intersects.length); 
    [...] 
} 

En realidad estoy alertando al recuento de objetos intersectados. Pero permanece cero. No pudo encontrar ningún objeto intersectado. Ya he jugado un poco armónico con los valores x, y y z de mi vector de proyección, sin éxito.

He agregado una muestra reducida para demostrar este problema en jsfiddle. Tal vez alguien tiene una pista breve para mí, ¿qué pasa?

Answer 1

En su violín, porque se está llamando THREE.SceneUtils.createMultiMaterialObject(), lo que crea una estructura jerárquica, es necesario agregar la opción recursiva para ray.intersectObjects().

var intersects = ray.intersectObjects(group.children, true); 

EDIT: ray es ahora una instancia de THREE.Raycaster - no THREE.Ray.

three.js R.58

Answer 2

que tenía el mismo problema y la respuesta de WestLangley da la respuesta. ¡Gran trabajo! Para cualquiera que esté luchando con la selección de objetos agrupados en Object3D wrapper también, estoy publicando mi propia solución.

Primero, creé una matriz de objetos que se pueden seleccionar; espero que esto también ahorre algo de rendimiento, ya que RayCaster no necesita buscar todos los objetos en la escena, sino solo aquellos a los que desea responder la selección. También os adjunto esta matriz a objeto de escena directa (únicamente con el hecho de que ya se puede acceder desde la mayor parte de mi aplicación)

scene.selectable = []; 

El siguiente paso es empujar todos los objetos que desea hacer seleccionable en esta matriz. Inserta solo mallas/sprites/etc. de su grupo, no de todo el grupo. Sólo última línea es importante aquí:

var myWrapper = new THREE.Object3D(); 
var myObject = new THREE.Mesh(something); 
myWrapper.add(myObject); 
scene.add (myWrapper); 
scene.selectable.push(myObject); 

Y por último en su rutina de selección del ratón se le llame raycaster así:

var intersects = ray.intersectObjects(scene.selectable);