Orientieren Sie die Drehung des Objekts an einer Spline-Punkt-Tangente in THREE.JS

ich benutzeSplineCurve3 Um eine Linie nur auf der X- und Y-Achse zu zeichnen, kann ein Würfel mithilfe von erfolgreich entlang dieser Linie animiert werdenspline.getPoint(t) Dabei ist t 0-1 in der Zeit. Ich versuche, den Würfel über seinen Aufwärtsvektor, der Y ist, unter Verwendung des Punktprodukts an der Linie auszurichten.

Es ist fast ausgerichtet, aber immer etwas heraus. Ich dachte, ich würde das Punktprodukt des Y-Vektors und den Tangens des aktuellen Punkts als Winkel verwenden, um eine Quaternion zu drehen.

Hier ist meine Renderfunktion:

function render() {

    var updateMatrix = new THREE.Matrix4(); 
    updateMatrix.setPosition(spline.getPoint(t));

    var angle = new THREE.Vector3(0,1,0).dot(spline.getTangent(t).normalize());

    var quat = new THREE.Quaternion;
    quat.setFromAxisAngle(new THREE.Vector3(0,0,1), angle);
    updateMatrix.setRotationFromQuaternion(quat);

    marker.rotation.getRotationFromMatrix(updateMatrix);
    marker.matrixWorld = updateMatrix;

    t = (t >= 1) ? 0 : t += 0.002;

    renderer.render(scene, camera); 
}

Und hier ist eine Geige, die mein Problem demonstriert. Kann mir jemand sagen, wo ich mit dem Rotationsaspekt falsch liege?

Sie können meine bearbeiten -jsfiddle Beispiel

Antworten auf die Frage(1)

Ihre Antwort auf die Frage