모델을 이동 (팬) 한 후 모델의 중심을 중심으로 회전

Question

JSONLoader를 사용하여 JSON 모델을로드하는 데 Three.js를 사용하고 있습니다. 또한 기본적인 상호 작용을 위해 TrackballControls.js를 사용하고 있습니다. 객체를 이동 (PAN)하면 회전이 다르게 작동합니다. 이동 후 모델 중심으로 회전을 변경하는 방법 (PAN)?

미리 감사드립니다.

Answer 1

트랙볼 컨트롤이 카메라가 메쉬가 아닌 카메라를 회전시키기 때문에. 회전은 패닝 후에 이상하게 보입니다. 대신에 트랙 볼 컨트롤을 사용하는 대신 쿼터니언을 기준으로 메쉬를 회전합니다. MouseMove 이벤트 이벤트에서 마우스까지에서이 코드

trackBallControls.noRotate = true; 
      if (isDragging === true) { 
       var deltaMove = { 
        x: event.offsetX -previousMousePosition.x, 
        y: event.offsetY -previousMousePosition.y 
       }; 
       var deltaRotationQuaternion = new THREE.Quaternion() 
         .setFromEuler(new THREE.Euler(toRadians(deltaMove.y * 0.3), 
           toRadians(deltaMove.x * 0.3), 
           0, 
           'XYZ' 
           )); 
       if (event.which === 1) { 
        mesh.quaternion.multiplyQuaternions(deltaRotationQuaternion, mesh.quaternion); 
       } 
      } 
      previousMousePosition = { 
       x: event.offsetX, 
       y: event.offsetY 
      }; 

을 false로 이벤트 세트 isDragging을 포함한다. mousedown에서 isDragging을 true로 설정합니다.

function toRadians(angle) { 
      return angle * (Math.PI/180); 
     }