threejs dynamically adjust the camera position so that the camera can see the object exactly

Core Code

obj is the target object \ controls are OrbitControls

let box3 = new THREE.Box3()box3.expandByObject(obj) // Calculate the model bounding boxlet size = new THREE.Vector3()box3.getSize(size) // Calculate bounding box sizelet center = new THREE.Vector3()box3.getCenter(center) // Calculate the geometric center coordinates of a hierarchical model corresponding to the bounding boxfunction maxSize(vec3) {let maxif (vec3.x > vec3.y) {max = vec3.x} else {max = vec3.y}if (max > vec3.z) {} else {max = vec3.z}return max}let max = maxSize(size) //The largest value of the length, width and high school of the bounding box is used to characterize the size of the model// 1. Controls the rendering range, but don't forget the camera is outside the model's bounding boxthis.camera.position.copy(center.clone()span>.addScalar(max))// 2. Centered rendering: set the camera target observation point, pointing to the center of the bounding box geometrythis.camera.lookAt(center)// 3. Pay attention to the near and far size controlsthis.camera.near = max * 0.1//It is best to associate with the camera position or the bounding box, don't set itSeemingly small values ​​like 0.1 1this.camera.far = max * 300//According to the camera position and bracket size settings, the bounding box is includedThat's it, it's better to make it too big, not too smallthis.camera.updateProjectionMatrix()//The rendering range changes, pay attention to update the projection matrixthis.controls.target.copy(center)this.controls.update()