web-dev-qa-db-ja.com

OrbitControlを制限するにはどうすればよいですか？

OrbitControls.jsを制限する方法はありますか？私が地面の上に何かを作成していると想像してください。カメラを地面の下に移動させたくありません。ズームインとズームアウトについても同じことが言えます。カメラを近づけすぎたり遠すぎたりしたくないので、いくつかの変数を設定してそれを制限する方法はありますか？

three.jscontrols
29
user1659565

OrbitControlsソース

ズームイン/ズームアウト

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

回転を停止する場所：

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

地下に行かせないでください

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

誰かが地上高度とカメラのターゲット調整でより堅牢な答えを必要とする場合に備えて：

コントロールのターゲットに対する相対的な角度とカメラの地上位置（高度に関係なく）を見つけ、maxPolarAngleを割り当てます。上軸に合わせて調整しました。私はYでした。コントロールの変更イベント内：

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

Orbitをさらに制御したい場合：

    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