使用四元数旋转会导致我的对象按特定角度缩放

时间:2019-06-19 15:03:12

标签: three.js rotation quaternions

我试图为我的threejs对象构建一个旋转控制器。我的轮换方法如下:

function rotate(axis, angle) {
    rotMat = new THREE.Matrix4().makeRotationAxis(axis, angle);
    rotMat.multiply(mesh.matrix);
    rotQuat = new THREE.Quaternion().setFromRotationMatrix(rotMat);
    mesh.quaternion.copy(rotQuat);
    mesh.updateMatrix();
}

我需要这样做,以便绕世界轴而不是局部轴旋转(与this帖子有关->由于存在问题,我在这里也不能使用Euler旋转成员描述here

解决我的问题

我制作了this JSFiddle,展示了这个问题。

如何重新创建:

1)打开小提琴链接。

2)按键盘上的X,Y或Z进入所需轴的旋转模式。

3)按住“向上箭头”键并旋转,直到发生“奇怪”缩放。应该以90-100度的角度发生。请注意,如果继续旋转,则缩放会继续进行

还请注意,到达特定角度区域时,我会减小旋转步长(旋转速度)。仅当旋转步长很小时才会发生缩放。

我的问题是:

有人知道为什么旋转会引起水垢吗?

1 个答案:

答案 0 :(得分:0)

发生这种情况的原因是,您需要向Quaternion.setFromRotationMatrix方法提供“纯”旋转矩阵。因此,将旋转功能更改为以下内容将起作用:

function rotate (axis, angle) {
  rotMat = new THREE.Matrix4().makeRotationAxis(axis, angle);
  rotMat.multiply(mesh.matrix);
  var rotMat2 = new THREE.Matrix4().extractRotation(rotMat);
  rotQuat = new THREE.Quaternion().setFromRotationMatrix(rotMat2);
  mesh.quaternion.copy(rotQuat);
  mesh.updateMatrix();
}