Wie erkennt man Kollisionen in three.js?

In Three.js die Dienstprogramme CollisionUtils.js und Collisions.js nicht mehr unterstützt werden, und mrdoob (Schöpfer von three.js selbst empfiehlt eine Aktualisierung auf die neueste version three.js und die Verwendung der Ray-Klasse für diesen Zweck statt. Was folgt, ist eine Möglichkeit, darüber zu gehen.

Die Idee ist diese: lassen Sie uns sagen, dass wir prüfen wollen, ob eine bestimmte Masche, die sogenannten "Spieler", schneidet alle Netze enthalten in ein array mit dem Namen "collidableMeshList". Was wir tun können ist, erstellen Sie eine Reihe von Strahlen, die die Koordinaten der mesh-Player (Spieler.position), und erstrecken sich in Richtung jeder vertex in der geometrie des mesh-Player. Jeder Strahl hat eine Methode namens "intersectObjects" das gibt ein array der Objekte, die den Strahl durchschnitten, und der Abstand jedes dieser Objekte (gemessen vom Ursprung des Strahls). Wenn der Abstand zu einer Kreuzung kleiner ist als der Abstand zwischen der position und der geometrie, vertex, dann die Kollision ereignete sich auf dem inneren des Spielers mesh -- was würden wir wahrscheinlich nennen Sie eine "tatsächliche" Kollision.

Ich gebucht haben, ein Beispiel an:

http://stemkoski.github.io/Three.js/Collision-Detection.html

Können Sie bewegen Sie den roten wireframe Würfel mit den Pfeiltasten und drehen Sie es mit W/A/S/D. Wenn es schneidet einem der blauen Würfel, der das Wort "Treffer" erscheint am oberen Rand des Bildschirms einmal für jede Kreuzung wie oben beschrieben. Der wichtige Teil des Codes ist unten.

for (var vertexIndex = 0; vertexIndex < Player.geometry.vertices.length; vertexIndex++)
{       
    var localVertex = Player.geometry.vertices[vertexIndex].clone();
    var globalVertex = Player.matrix.multiplyVector3(localVertex);
    var directionVector = globalVertex.subSelf( Player.position );

    var ray = new THREE.Ray( Player.position, directionVector.clone().normalize() );
    var collisionResults = ray.intersectObjects( collidableMeshList );
    if ( collisionResults.length > 0 && collisionResults[0].distance < directionVector.length() ) 
    {
        //a collision occurred... do something...
    }
}

Es gibt zwei mögliche Probleme mit diesem Ansatz.

(1) Wenn der Ursprung der ray ist in ein Gitter M, keine Ergebnisse Kollision zwischen dem Strahl und M zurückgegeben werden.

(2) ist Es möglich, für ein Objekt, das kleiner ist (in relation zu den Spieler-Netz) zu "gleiten" zwischen den verschiedenen Strahlen und somit keine Kollision registriert wird. Zwei mögliche Ansätze zur Verringerung der Chancen von diesem problem, code zu schreiben, so dass die kleinen Objekte erstellen, die Strahlen und machen die Kollisionserkennung Aufwand aus Ihrer Sicht, oder mehr vertices auf dem mesh (z.B. mit CubeGeometry(100, 100, 100, 20, 20, 20) anstatt CubeGeometry(100, 100, 100, 1, 1, 1).) Der Letztgenannte Ansatz wird voraussichtlich zu einer Leistung getroffen, so empfehle ich, verwenden Sie es sparsam.

Ich hoffe, dass andere dazu beitragen wird, diese Frage mit Ihren Lösungen auf diese Frage. Ich kämpfte mit ihm für eine Weile, mich vor der Entwicklung der Lösung die hier beschrieben ist.

InformationsquelleAutor der Antwort Lee Stemkoski