Three.js圍繞物體旋轉相機（可能會移動）

Question

我有一個相機在場景中以幾種不同的方式移動。 相機應圍繞目標位置旋轉。 就我而言，這是用戶定位的網格上的一個點。 因為相機通常不需要相對於這一點移動，所以我無法在這里使用樞軸點： https ： //github.com/mrdoob/three.js/issues/1830 。 我當前的解決方案使用以下代碼：

var rotationY = new THREE.Matrix4();
var rotationX = new THREE.Matrix4();
var translation = new THREE.Matrix4();
var translationInverse = new THREE.Matrix4();
var matrix = new THREE.Matrix4();
function rotateCameraAroundObject(dx, dy, target) {  
    // collect up and right vectors from camera perspective
    camComponents.up = rotateVectorForObject(new THREE.Vector3(0,1,0), camera.matrixWorld);
    camComponents.right = rotateVectorForObject(new THREE.Vector3(1,0,0), camera.matrixWorld);

    matrix.identity();

    rotationX.makeRotationAxis(camComponents.right, -dx);
    rotationY.makeRotationAxis(camComponents.up, -dy);
    translation.makeTranslation(
        target.position.x - camera.position.x,
        target.position.y - camera.position.y,
        target.position.z - camera.position.z);
    translationInverse.getInverse(translation);

    matrix.multiply(translation).multiply(rotationY).multiply(rotationX).multiply(translationInverse);
    camera.applyMatrix(matrix);
    camera.lookAt(target.position); 
}

問題是我們不想使用lookAt，因為重新定位。 我們希望能夠刪除該行。

如果我們在沒有lookAt的情況下使用上面的代碼，我們會圍繞這一點進行旋轉，但是我們不會看到這一點。 我的理解是我的方法應該像攝像機本身旋轉一樣旋轉攝像機的視圖，而是相機旋轉一小部分。 誰能幫我理解什么是錯的？

編輯：清理原始帖子和代碼，希望澄清我的問題。

我的想法是我可以轉換到原點（我的目標位置），旋轉我想要的數量，然后轉換回起始位置。 由於輪換，我希望看到原點的新位置。

事實上，我現在正在測試它而沒有使用轉換矩陣，所以矩陣乘法線是：

matrix.multiply(rotationY).multiply(rotationX);

它似乎表現得一樣。 感謝目前為止所有的幫助！

還有一件事！ 問題的一部分是當攝像機表現得非常接近北極或南極時。 我正在尋找一種“自由漫游”的感覺。

Answer 1

將以下內容放在渲染循環中：

camera.position.x = target.position.x + radius * Math.cos( constant * elapsedTime );         
camera.position.z = target.position.z + radius * Math.sin( constant * elapsedTime );
camera.lookAt( target.position );

renderer.render( scene, camera );

或者，您可以使用THREE.OrbitControls或THREE.TrackballControls 。 請參閱three.js示例。

Answer 2

你所指的萬向節鎖（重定向）是因為在相機外觀的默認實現中使用了歐拉角。 如果你設置

camera.useQuaternion = true;

在你看來之前，不會使用歐拉角。 這會解決你的問題嗎？