限制场景的最大缩放 Three.js

Question

I have a Three.js App and I wanna limit the zoom for the scene, because logically at some zoom the user can get inside of my 3D object, which in my oppinion is not a really good UX.

I tried scene.maxZoom = number; but did not work. What can I do?

Here is the code: https://github.com/AlinAlexandruPeter/code/blob/main/code.js

Answer 1

You don't need Three.js to limit the range of numbers, just simple JavaScript. Use Math.min(a, b) to get the lower of the two values.

const MAX_ZOOM = 2.5;

// Clamp user input to 2.5 and below
camera.zoom = Math.min(userInput, MAX_ZOOM);

With this approach, if userInput = 3 , it will get clamped at 2.5 . There's also Math.max() if you want to clamp it on the lower range.