Skrzyżowanie w Object3D

Question

Mam niektóre obiekty dodane do Object3D (do grupowania elementów) i próbuję wykryć kliknięcia na nim. Moja scena ma rozmiar 600x400, mój aparat jest w trzech obiektów i mój kod obsługi zdarzeń wygląda następująco:

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); 
    [...] 
} 

Właściwie jestem ostrzeganie rachubę przecinają obiektów. Ale pozostaje zero. Nie mógł znaleźć żadnych przecinanych obiektów. Zagrałem już trochę z wartościami x, y i z mojego wektora projekcyjnego - bez powodzenia.

Dodałem próbkę z pominięciem, aby zademonstrować ten problem na stronie jsfiddle. Może ktoś ma dla mnie krótką wskazówkę, co jest z tym nie tak?

Answer 1

W swoim skrzypcach, ponieważ wywołujesz THREE.SceneUtils.createMultiMaterialObject(), który tworzy strukturę hierarchiczną, musisz dodać flagę rekursywną do ray.intersectObjects().

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

EDIT: ray jest instancją THREE.Raycaster - nie THREE.Ray.

Three.js r.58

Answer 2

miałem ten sam problem i odpowiedź WestLangley zapewnia odpowiedź. Dobra robota! Dla każdego, kto zmaga się z wyborem myszki obiektów zgrupowanych w wrapperu Object3D, zamieszczam własne rozwiązanie.

Najpierw utworzyłem tablicę obiektów do wyboru - mam nadzieję, że to również oszczędza trochę wydajności, ponieważ RayCaster nie musi przeszukiwać wszystkich obiektów w scenie, ale tylko te, które chcą odpowiedzieć na wybór. Ja także przypisane tej tablicy do obiektu sceny bezpośrednio (wyłącznie dla tego, że jest już dostępna z większości części mojego app)

scene.selectable = []; 

Następnym krokiem jest doprowadzenie wszystkich obiektów, które chcesz dokonać wyboru na tej tablicy. Wstawisz tylko siatkę/sprite'a/etc z twojej grupy, a nie całą grupę. Tylko ostatnia linia ma znaczenie:

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

I wreszcie w swojej selekcji rutyny myszy można nazwać RayCaster tak:

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