Search code examples
javascriptthree.jsfrontend

how to set limit of camera position in threejs

I want to set the limitation of the camera position in my threejs scene and I don't know how to do that. For example, when I'm using OrbitControls and zoom out, the camera zoom in and zoom out doesn't have any limit. I want the camera to stop when camera.position.z = 5 and stop again when camera zoom out is about camera.position.z = 10. I want to set the camera.position.z between these positions. Look at the camera limit on this site model: https://threejs-journey.com/

I tried this:

if (camera.position.z =< 5) {
    camera.position.z = 5;
}
else if (camera.position.z >=10)
{
    camera.position.z = 10;
}
Solution

  • If you want to set limits to the zoom levels, you can use OrbitControls.maxDistance and .minDistance. By default, these values are infinity and zero, respectively, so that’s why you’re not hitting any limit when zooming out.

    controls.maxDistance = 20;
controls.minDistance = 3;