Three.js: Das Kamera-Objekt scheint sich seine Position zu merken

Frage

Die Kameraposition und Ausrichtung werden durch das Drücken der Pfeil-nach-oben-Taste verändert.

document.addEventListener("keydown", event => {
    if (event.keyCode === 38) {
        camera.position.set( 30, 30, 10 );
        camera.lookAt( 0, 0, 0 );
    }
});

Wenn ich aber nach dem Drücken der Pfeil-nach-oben-Taste die Maus zum Zoomen, Schwenken oder Drehen verwende, z.B. durch Drehen des Mausrades, scheint sich das Kamera-Objekt die Kamerarichtung von vor dem Drücken der Pfeil-nach-oben-Taste gemerkt zu haben.

Gibt es einen Cache, den ich leeren muss? Oder muss ich das Kamera-Objekt aktualisieren?

Antwort

Es war nicht das Kamera-Objekt, das sich die Richtung gemerkt hat, sondern das Control-Objekt (OrbitControl) in der Eigenschaft .target.

Das sagt ChatGPT dazu:

controls.target in Three.js‘ OrbitControls ist ein Vektor (THREE.Vector3), der den Punkt im Raum angibt, um den die Kamera rotiert. Es ist also der Fokus oder der „Look-at“-Punkt der Kamera, nicht die Position oder Rotation des „Joysticks“.

Die OrbitControls sind so konzipiert, dass sie eine einfache Möglichkeit bieten, eine Kamera um einen bestimmten Punkt im Raum zu drehen. Der Benutzer kann mit der Maus oder dem Touchscreen interagieren, um die Kamera um diesen Punkt zu drehen. Die Kameraposition und -rotation werden automatisch aktualisiert, basierend auf der Interaktion des Benutzers.

Wenn Sie controls.target ändern, ändern Sie den Fokus der Kamera, um auf einen anderen Punkt im Raum zu zeigen. Die Kamera wird dann um diesen neuen Punkt rotieren, wenn der Benutzer interagiert. Um die Kameraposition zu ändern, sollten Sie scene._camera.position.set(x, y, z) verwenden und dann controls.update() aufrufen, um die Controls zu aktualisieren, damit sie die neue Kameraposition berücksichtigen.