Three.js- Wie kann ich die Kameraansicht in einer 3D-Szene einschränken?

Question

Ich habe die Steuerelemente für die erste Person zu einer three.js-Szene hinzugefügt. Ich möchte die Kameraansichten einschränken, so dass die Enden der Szene nicht angezeigt werden. Ich verwende die firstpersoncontrols.js aus der three.js-Bibliothek, die Maus-, W-, A-, S-, D- und Pfeilsteuerelemente enthält. Wie können die Kameraansichten mit den Steuerelementen eingeschränkt werden? Ich habe schon versucht, den Kontrollabstand zu begrenzen. Hier ist das, was ich bisher in Bezug auf die Kamera und Kontrollen:

camera = new THREE.PerspectiveCamera(55, window.innerWidth/window.innerHeight, 1, 20000); 
      camera.position.set(30, 30, 100); 
      // 
      controls = new THREE.FirstPersonControls(camera); 
         controls.movementSpeed = 100; 
         controls.enabled=true; 
         controls.maxDistance=50;//no change 
         controls.minDistance=10 
         controls.enablezoom=false; 

https://codepen.io/anon/pen/baNJGR

Answer 1

Wenn Sie einstellen mögen, wie weit und breit Ihre Kamera sehen soll, dann können Sie die FOV einstellen, nah und fern Parameter (PerspectiveCamera (fov, aspect, near, far)).

Zum Beispiel versucht Kamera mit diesen Werten zu schaffen (versuchen Sie es auf dem codepen Beispiel) können

camera = new THREE.PerspectiveCamera(50, window.innerWidth/window.innerHeight, 1, 200); 

Sie die FOV ändern Breite der Kamera simuliert Ansicht zu entscheiden, und weit Parameter ändern, wie weit anpassen Die Kamera sollte sehen.