web-dev-qa-db-fra.com

Comment mettre des limites sur OrbitControl?

Existe-t-il un moyen de limiter les OrbitControls.js? Imaginez que je crée quelque chose au-dessus du sol, je ne voudrais pas que la caméra passe sous le sol, vous voyez ce que je veux dire?! Il en va de même pour les zooms avant et arrière. Existe-t-il un moyen de définir certaines variables pour limiter cela parce que je ne veux pas que la caméra se rapproche ou s'éloigne trop?

three.jscontrols
29
user1659565

source OrbitControls

Zoom avant Zoom arrière

this.minDistance = 0;
this.maxDistance = Infinity;

Où arrêter la rotation:

this.minPolarAngle = 0; // radians
this.maxPolarAngle = Math.PI; // radians

Ne laissez pas aller sous terre

controls.maxPolarAngle = Math.PI/2;
56
uhura

Juste au cas où quelqu'un aurait besoin d'une réponse plus robuste avec l'altitude au sol et le réglage de la cible de la caméra:

Vous trouvez l'angle par rapport à la cible des commandes et la position au sol de la caméra (quelle que soit l'altitude) et attribuez le maxPolarAngle. Ajustez votre axe vers le haut, le mien était Y. À l'intérieur de l'événement de changement de commandes:

var centerPosition = controls.target.clone();
centerPosition.y = 0;
var groundPosition = camera.position.clone();
groundPosition.y = 0;
var d = (centerPosition.distanceTo(groundPosition));

var Origin = new THREE.Vector2(controls.target.y,0);
var remote = new THREE.Vector2(0,d); // replace 0 with raycasted ground altitude
var angleRadians = Math.atan2(remote.y - Origin.y, remote.x - Origin.x);
controls.maxPolarAngle = angleRadians;
1
Radio

Si vous voulez plus de contrôle sur Orbite:

    const controls = new OrbitControls(camera, this.renderer.domElement);
    controls.enableDamping = true;   //damping 
    controls.dampingFactor = 0.25;   //damping inertia
    controls.enableZoom = true;      //Zooming
    controls.autoRotate = true;       // enable rotation
    controls.maxPolarAngle = Math.PI / 2; // Limit angle of visibility
    controls.keys = {
      LEFT: 37, //left arrow
      UP: 38, // up arrow
      RIGHT: 39, // right arrow
      BOTTOM: 40 // down arrow
    };

   controls.addEventListener("change", () => {
      if (this.renderer) this.renderer.render(this.scene, camera);
    });
0
Hitesh Sahu