我最近发布了类似的问题,现在也面临类似的问题。
我按照以下方式根据摄像机目标计算旋转度:
if (cameraTarget !== null) {
const distance: number = new THREE.Vector3().subVectors(this.camera.position, cameraTarget).length();
const normal: Vector3 = new THREE.Vector3(0,0,-1).applyQuaternion(this.camera.quaternion);
this.orbitControls.target = new THREE.Vector3().add(this.camera.position).add(normal.setLength(distance));
}
但是,当我在没有设置相机目标的情况下再次更改旋转角度时,在变焦时相机的位置也会发生变化。这是进行旋转的代码:
public tweenCameraTo(position: THREE.Vector3, rotation: THREE.Vector3, cameraTarget: THREE.Vector3 = null, duration: number = null): void {
if (this.currentTween) {
this.currentTween.stop();
}
const cam = this.camera;
const currentPos = cam.position.clone();
const currentRot = cam.rotation.clone();
const epsilon = {
px: currentPos.x,
py: currentPos.y,
pz: currentPos.z,
rx: currentRot.x,
ry: currentRot.y,
rz: currentRot.z,
z: cam.zoom
};
const target = {
px: position.x,
py: position.y,
pz: position.z,
rx: rotation.x,
ry: rotation.y,
rz: rotation.z,
z: 1
};
if (duration == null) {
duration = APP_CONFIG.surface_anim_duration;
}
this.currentTween = new TWEEN.Tween(epsilon)
.to(target, duration)
.onUpdate(() => {
cam.position.set(epsilon.px, epsilon.py, epsilon.pz);
cam.rotation.set(epsilon.rx, epsilon.ry, epsilon.rz);
this.orbitControls.dispatchEvent({type: 'change', target: null});
if (cameraTarget == null) {
cam.translateZ(-2.8);
this.orbitControls.target = cam.position.clone();
cam.translateZ(2.8);
} else {
this.orbitControls.target.copy(cameraTarget);
}
cam.zoom = epsilon.z;
cam.updateProjectionMatrix();
this.orbitControls.dispatchEvent({type: 'change', target: null});
this.orbitControls.enabled = false;
})
.onComplete(() => {
this.orbitControls.enabled = true;
this.currentTween = null;
// as done in https://stackoverflow.com/questions/51211900/calculate-camera-target-for-orbit-controls-from-given-rotation-and-position-of-c/51214533#51214533
if (cameraTarget !== null) {
const distance: number = new THREE.Vector3().subVectors(this.camera.position, cameraTarget).length();
const normal: Vector3 = new THREE.Vector3(0,0,-1).applyQuaternion(this.camera.quaternion);
this.orbitControls.target = new THREE.Vector3().add(this.camera.position).add(normal.setLength(distance));
}
// cam.lookAt(new THREE.Vector3(1,1,1));
})
.easing(TWEEN.Easing.Quadratic.InOut);
this.currentTween.start();
}