Rotatable object with right click drag

I am not an expert on rotations but I would avoid rotations using local axis. I would use world axis but rotated according to the camera.

const xAxis = new Vector3(1, 0, 0);
const yAxis = new Vector3(0, 1, 0);

camera.on('rotationchange', () => {
  xAxis.set(1, 0, 0).applyQuaternion(camera.quaternion);
  yAxis.set(0, 1, 0).applyQuaternion(camera.quaternion);
});

function onDrag(e) {
  e.preventDefault(); // not move obj
  e.target.rotateOnWorldAxis(xAxis, e.movementY * 0.01);
  e.target.rotateOnWorldAxis(yAxis, e.movementX * 0.01);
}

mesh.on('drag', onDrag);

Is this example good?

1 Like