Question

我有一个带有网格的平面/板，大约1100 x 1100.我有平移，缩放和旋转工作，除了在平移后电路板移回屏幕中心的事实。所以，如果我根本不平板，那么一切正常。在我平移电路板后，当我尝试旋转它时，它会移回屏幕中心。我无法弄清楚如何改变相机的原点，使其围绕电路板的中心旋转。看起来它围绕着相机的中心旋转。

var radius = 1500，theta = 45 * 0.5，onMouseDownTheta = 45 * 0.5; var fov = 45; var mouse2D = new THREE.Vector3（0,10000,0.5）;

cameraX = radius * Math.sin（THREE.Math.degToRad（theta））; cameraY = 1000; cameraZ = radius * Math.cos（THREE.Math.degToRad（theta））;

camera = new THREE.PerspectiveCamera（fov，window.innerWidth / window.innerHeight，1,10000）; camera.position.set（cameraX，cameraY，cameraZ）;

scene = new THREE.Scene（）; camera.lookAt（scene.position）;

渲染（）;

ThreeBoard.prototype.render = function（）{

mouse2D.x = (event.clientX / window.innerWidth) * 2 - 1;
mouse2D.y = - (event.clientY / window.innerHeight) * 2 + 1;

// rotate
if (isMouseDown && isShiftPressed && !isCtrlPressed) {
    theta = ((event.pageX - mouse2D.x) * 0.5) + onMouseDownTheta;

    cameraX = radius * Math.sin(THREE.Math.degToRad(theta));
    cameraZ = radius * Math.cos(THREE.Math.degToRad(theta));

    camera.position.set(cameraX, cameraY, cameraZ);

    camera.lookAt(scene.position);
}

// pan
if (isMouseDown && isShiftPressed && isCtrlPressed) {
    theta = ((event.pageX - mouse2D.x) * 0.5) + onMouseDownTheta;

    cameraX += 10 * mouse2D.x;
    // cameraY += 10;
    cameraZ -= 10 * mouse2D.y;

    camera.position.set(cameraX, cameraY, cameraZ);

    // camera.lookAt(scene.position);
}

renderer.render(scene, camera);

};

three.js：平移相机后旋转原点

0 个答案: