When implementing a 3rd person camera, the key is to always keep the camera focused on the player or an offset from the player.
The approach involves having the camera smoothly follow the player's movements over time.
In the provided code snippet, there is a cameraRig that trails the player. The purpose of the camera rig is to handle the positioning of the camera above the ground without requiring manual calculations. Additionally, a camTarget object is connected to the player, ensuring that the camera maintains a view at shoulder height.
function main() {
// Code for initializing scene, camera, lights, and objects
}
main();
body {
margin: 0;
}
#c {
width: 100vw;
height: 100vh;
display: block;
}
<script src="https://threejsfundamentals.org/threejs/resources/threejs/r113/build/three.min.js"></script>
<canvas id="c" tabindex="0"></canvas>
Developing effective 3rd person cameras can be challenging. The explained technique may seem basic, comparing it to dragging a camera rig behind the player like a tether. If the camera exceeds the maximum distance threshold, it adjusts its position while maintaining proximity to the player.
An alternative common strategy is to place the camera on an extendible rod so that moving backward extends the camera's distance accordingly.
function main() {
// Similar setup as before for camera and scene initialization with added functionality for handling camera distance
}
main();
body {
margin: 0;
}
#c {
width: 100vw;
height: 100vh;
display: block;
}
<script src="https://threejsfundamentals.org/threejs/resources/threejs/r113/build/three.js"></script>
<canvas id="c" tabindex="0"></canvas>
Further considerations in 3rd person camera design involve managing obstacles obstructing the player-camera view and addressing scenarios like passing through doorways. These complex situations require special handling such as fading out obstructive elements or intelligently adjusting the camera perspective during transitions.
It's noteworthy that parts of the implemented code assume objects have simple world positions (no parent-child relationship affecting coordinates). For instances where objects have parents, additional steps are needed to accurately determine and apply world positions.