2

シーンでトラックボール コントロールを使用しており、キャンバス内でマウスをドラッグするのと同じようにカメラを回転させる機能を実装したいと考えています。どうすればそのようなことを達成できますか? トラックボール コントロール モジュールのコードを調べましたが、開始するものが見つかりません。

編集: 私はいくつかのページ、3 つのドキュメントなどを見てきましたが、まだトラックボール スタイルの回転を再現できません。私もクォータニオンを使用していますが、動作を再現できません (または、おそらく何かが欠けています)。何か助けはありますか？

編集2:私が探しているのは、次のようなことをする方法です:

function rotateCam(angle) { // code }

var angle = 0.01; //some value
rotateCam(angle);
$('#button').addEventListener('mousedown', function() { rotateCam(angle); } );

buttonボタンを表す HTML 要素はどこにありますか。

4

3 に答える 3

3

トラックボール コントロールは、クォータニオンによる回転とは別に、距離を修正するためにズームを行うことに気付きました。コードを読み取ろうとしたところ、次のようになりました。

function rotate(L) {
    var vector = controls.target.clone();
    var l = (new THREE.Vector3()).subVectors(camera.position, vector).length();
    var up = camera.up.clone();
    var quaternion = new THREE.Quaternion();

    // Zoom correction
    camera.translateZ(L - l);

    quaternion.setFromAxisAngle(up, 0.015);
    camera.position.applyQuaternion(quaternion);
    camera.lookAt(vector);
    renderer.render(scene, camera);
}

魅力のように機能します...誰かがこれも役立つことを願っています。;)

于 2013-08-19T16:20:11.917 に答える
1 
function cameraRotate(distance, angle){

            camera.position.x = distance * Math.cos( angle );
            camera.position.z = distance * Math.sin( angle );

}

これにより、シーンの周りで指定された距離と角度でカメラが回転します。滑らかな回転が必要な場合は、たとえば入力に応じて、animate-loop から角度を少し増やしてこれを呼び出すことができます。

于 2013-08-18T13:20:02.223 に答える
0

私は正しいと思います...私はこれをしました：

function rotate() {
    if (this.showCase) {
        var vector = controls.target.clone(); // controls is a TrackballControls
        var up = camera.up.clone();
        var quaternion = new THREE.Quaternion();
        quaternion.setFromAxisAngle(up, 0.015);
        camera.position.applyQuaternion(quaternion);
        camera.lookAt(vector);
        renderer.render(this.scene, this.camera);
    }
},

それでも、TrackballControls の回転のようには正しく見えません。

于 2013-08-14T21:58:50.953 に答える