Question

我正在为3D模型编写窗口小部件，类似于Autodesk Forge，例如此链接https://forge-rcdb.autodesk.io/database?id=5841e11f540a4d30802763e2。您可以单击轨道图标（左下角图标）以显示小部件。我想在Three.js中编写与在此示例中在窗口小部件上的圆上拖动时相同的锁定旋转。看起来Autodesk Forge中的模型跟随鼠标移动，在圆上拖动时始终围绕世界轴旋转。

我现在有一些类似的代码： mesh是我在立方体上拖动时围绕世界Z轴旋转的立方体（我的立方体周围有一个圆圈，非常类似于autodesk forge）。现在，我将旋转角度设置为0.1，当我更改鼠标移动方向时，我想将值更改为-0.1。就像在Autodesk Forge中一样。

function mouseMove(e) {
if(isDragging) {
 var deltaMove = {
     x: e.offsetX - previousMousePosition.x,
     y: e.offsetY - previousMousePosition.y
 };


 var rotation = mesh.matrix;
 var rotationSpeed;

 if (isDraggingCircle) {


     var angle=0.1;


     var worldZAxis = new THREE.Vector3(0, 0, 1).applyMatrix4(new THREE.Matrix4().getInverse(rotation));
     var rotationWorldZ = new THREE.Matrix4().makeRotationAxis(worldZAxis,  angle);
     rotation.multiply(rotationWorldZ);


 }


 }


 previousMousePosition = {x: e.offsetX, y: e.offsetY};
 mesh.matrixAutoUpdate = false;
 mesh.matrix = rotation; }}

像在Autodesk Forge中一样，如何在three.js中为3D模型进行圆旋转？

0 个答案: