三轴使用轨道控制将物体逐渐旋转到相机所看到的位置



我计划使用Orbit Control做一个简单的第三人称相机视图,但我似乎不知道该怎么做。当我围绕一个物体旋转相机,并按下"W"键向前移动时,我希望物体"看起来"逐渐旋转并移动到相机所面对的新方向。我该怎么做呢?

可以通过逐渐将对象旋转到相机方向来实现这一点。
在这里做了一个codepen,为了简单起见,它使用了一个通用的替代轨道控件:
https://codepen.io/cdeep/pen/QWMWyYW

// Get the X-Z plane in which camera is looking to move the player
camera.getWorldDirection(tempCameraVector);
const cameraDirection = tempCameraVector.setY(0).normalize();

// Get the X-Z plane in which player is looking to compare with camera
model.getWorldDirection(tempModelVector);
const playerDirection = tempModelVector.setY(0).normalize();
// Get the angle to x-axis. z component is used to compare if the angle is clockwise or anticlockwise since angleTo returns a positive value
const cameraAngle = cameraDirection.angleTo(xAxis) * (cameraDirection.z > 0 ? 1 : -1);
const playerAngle = playerDirection.angleTo(xAxis) * (playerDirection.z > 0 ? 1 : -1);

// Get the angle to rotate the player to face the camera. Clockwise positive
const angleToRotate = playerAngle - cameraAngle;

// Get the shortest angle from clockwise angle to ensure the player always rotates the shortest angle
let sanitisedAngle = angleToRotate;
if(angleToRotate > Math.PI) {
sanitisedAngle = angleToRotate - 2 * Math.PI
}
if(angleToRotate < -Math.PI) {
sanitisedAngle = angleToRotate + 2 * Math.PI
}

// Rotate the model by a tiny value towards the camera direction
model.rotateY(
Math.max(-0.05, Math.min(sanitisedAngle, 0.05))
);

最新更新