threejs-如何相对于鼠标将对象从其当前中心点旋转到度设置

Question

我在一个场景中有一个threejs模型，其终点为0,0,0。我必须旋转它，以便它的静止位置处于我想要的角度，并对其进行动画处理，因此该位置和旋转均不为0,0,0。此外，已将相机定位并设置为注视对象，因此其位置和旋转已更改。

我想获取用户的鼠标坐标，只是让模型围绕世界Y轴的中心点旋转一定数量的最大和最小角度。我知道如何将鼠标坐标映射到所需的度数/弧度角，但是如何告诉模型旋转？

我已经尝试过model.rotation.y = [radians]，并且我假设它根据当前具有的任何旋转矩阵旋转（或者至少不是我期望的那样）。如果我执行rotateOnWorldAxis，它会从导入时的0,0,0点开始旋转，这不是我想要的位置，而且也不是绝对的度数（即，它从该位置开始旋转30度）当前，这是每一次鼠标移动，而不是在世界原点上移动30度。

我如何使其在世界Y轴上以其中心点旋转一定角度？

模型位置在{_x: 0, _y: -0.3, _z: -2}，其旋转在{x: -2, y: 2.4, z: 0}摄像机位置为{x: 0, y: 0, z: 5}，旋转位置为{_x: 0.3926990816987242, _y: 0, _z: -0}。

当前代码是：

const target = this.mouseTarget;
const mouseX = clientX - this.halfWidth; //halfWidth is half the screen width, client X is the mouse e.clientX
const mouseY = clientY - this.halfHeight;
target.x += (mouseX - target.x) * 0.02;
target.y += (-mouseY - target.y) * 0.02;
target.z = this.camera.position.z; // assuming the camera is located at ( 0, 0, z );
const maxRotDeg = 30;
const maxRot = this.degToRad(maxRotDeg);
const rotVal = this.mapValue(
  target.x,
  -this.halfWidth,
  this.halfWidth,
  -maxRot,
  maxRot,
); //works to give me the radians that I want for rotation
//this.modelGroup.rotateOnWorldAxis(this.rotationAxisY, rotVal); //doesn't work
//this.modelGroup.lookAt(target); //doesn't work

我在一个场景中有一个threejs模型，其终点为0,0,0。我必须旋转它，以便它的静止位置处于我想要的角度，并对其进行动画处理，因此该位置也不是...

Answer 1

最简单的generic