Question

我正在使用具有Three.js扩展名的JSModeler。我的查看器是JSM.ThreeViewer（）。密码笔为：https://codepen.io/Dharnidharka/pen/QRzBQa

我想要实现的是同心圆围绕其中心旋转，但是目前旋转围绕世界中心。

在three.js中，可以通过具有父Object3D并将所有网格添加到该对象，然后使用geometry.center（）将该对象居中，然后进行旋转来完成。但是我找不到JSModeler的Object3D扩展。
Three.js中的另一种方法可能是围绕一个共同的轴对对象进行分组，但是即使这种方法对我也不起作用。
我尝试的第三种方法是What's the right way to rotate an object around a point in three.js?中Update（）循环中的解决方案，但效果不佳

我使用以下方法将对象移动到枢轴点：

  meshes = JSM.ConvertModelToThreeMeshes (model);

  viewer.AddMeshes (meshes);

  for(var i =3; i<10; i++) {

    meshes[i].geometry.computeBoundingBox();
    meshes[i].geometry.boundingBox.getCenter(center);
    meshes[i].geometry.center();
    var newPos = new THREE.Vector3(-center.x, -center.y, -center.z);
    meshes[i].position.copy(newPos);

  }

预期输出是两个圆围绕共同的中心旋转，该中心也将成为世界中心。目前，他们正在围绕世界中心旋转，而不是围绕其共同中心旋转。

Answer 1

最后弄清楚了。

在上面发布的代码中，我将几何图形居中，然后将其移回原始位置。所需要的是使几何体居中，然后使网格围绕中心相对彼此移动，以使配置不会混乱。有2个网格组。必须为每个计算中间值，然后相应地转换几何形状。代码中的解决方案：

   var center = new THREE.Vector3();
   var mid1 = new THREE.Vector3();

    for(var i =0; i<len1; i++) {

        viewer.GetMesh(i).geometry.computeBoundingBox();
        viewer.GetMesh(i).geometry.boundingBox.getCenter(center);
        viewer.GetMesh(i).geometry.verticesNeedUpdate = true;
        mid1.x += center.x;
        mid1.y += center.y;
        mid1.z += center.z;

      }

      mid1.x = mid1.x / len1;
      mid1.y = mid1.y / len1;
      mid1.z = mid1.z / len1;

      for(var i = 0; i<len1; i++) {

        viewer.GetMesh(i).geometry.computeBoundingBox();
        viewer.GetMesh(i).geometry.boundingBox.getCenter(center);
        viewer.GetMesh(i).geometry.center();
        var newPos = new THREE.Vector3(center.x - mid1.x, center.y - mid1.y, center.z - mid1.z);
        viewer.GetMesh(i).geometry.translate(newPos.x, newPos.y, newPos.z);

      }

在JSModeler中围绕它们的中心旋转一组对象

1 个答案: