Ich habe einige Objekte zu einem Object3D hinzugefügt (um Elemente zu gruppieren) und versuche, Klicks darauf zu erkennen.
Meine Szene hat eine Größe von 600x400 , meine Kamera befindet sich in einem Drei-Objekt und mein Event-Handler-Code sieht wie folgt aus:
Tatsächlich warne ich die Anzahl der geschnittenen Objekte. Aber es bleibt Null. Es konnte keine geschnittenen Objekte gefunden werden. Ich habe schon ein wenig mit den x-, y- und z-Werten meines Projektionsvektors gespielt - ohne Erfolg.
Ich habe ein abgespecktes Beispiel hinzugefügt, um dieses Problem auf jsfiddle zu demonstrieren. Vielleicht hat jemand einen kurzen Hinweis für mich, was schief läuft?
Da Sie in Ihrer Geige THREE.SceneUtils.createMultiMaterialObject( ) aufrufen, was eine hierarchische Struktur erzeugt, müssen Sie das rekursive Flag zu ray.intersectObjects() hinzufügen.
EDiT: ray ist jetzt eine Instanz von THREE.Raycaster - nicht THREE.Ray .
drei.js r.58
Ich hatte das gleiche Problem und WestLangleys Antwort gibt die Antwort. Gut gemacht! Für jeden, der mit der Mausauswahl von Objekten kämpft, die ebenfalls im Object3D Wrapper gruppiert sind, poste ich meine eigene Lösung.
Zuerst habe ich ein Array von auswählbaren Objekten erstellt - ich hoffe, das spart auch etwas Leistung, da RayCaster nicht alle Objekte in der Szene durchsuchen muss, sondern nur diejenigen, die auf die Auswahl antworten wollen. Ich habe dieses Array auch direkt an das Szene-Objekt angehängt (allein wegen der Tatsache, dass es bereits von den meisten Teilen meiner App aus zugänglich ist)
%Vor%Der nächste Schritt besteht darin, alle Objekte, die Sie auswählen möchten, in dieses Array zu schieben. Sie werden nur Meshes / Sprites / etc aus Ihrer Gruppe einfügen, nicht die ganze Gruppe. Nur die letzte Zeile ist hier wichtig:
%Vor%Und zuletzt in Ihrer Mausauswahlroutine rufen Sie rycaster so an:
%Vor%Tags und Links javascript three.js