【问题标题】:three.js rotate Object3d around Y axis at it centerthree.js 在它的中心围绕 Y 轴旋转 Object3d
【发布时间】:2013-07-28 06:06:42
【问题描述】:

我在Three.JS 中有一个Object3d,它是一组网格对象。
我想围绕 Y 轴旋转这个组,在它的中心,远离世界中心 (0,0,0)。
我只知道Group.rotate.y += deg 代码,但是对于每个轴方向,它总是围绕 (0,0,0) 旋转对象,而不是我的组中心!
我怎样才能解决这个问题?

更新:

阅读cmets

【问题讨论】:

    标签: 3d rotation three.js


    【解决方案1】:

    How to rotate a 3D object on axis three.js?

    我这样解决了这个问题:

    我为 ThreeJS 创建了“ObjectControls”模块,它允许您旋转单个 OBJECT(或组),而不是 SCENE。

    包含库:

    用法:

    var controls = new THREE.ObjectControls(camera, renderer.domElement, yourMesh);

    您可以在这里找到现场演示:https://albertopiras.github.io/threeJS-object-controls/

    这里是回购:https://github.com/albertopiras/threeJS-object-controls

    【讨论】:

      【解决方案2】:

      This answer 帮助了我,但代码不太正确。轴必须是单位向量,object.rotateOnAxis() 是增量的。

      这是一个工作示例:

      var axis = new THREE.Vector3(4, 0, 7).normalize();
      var speed = 0.01;
      
      // set up scene, etc.
      
      function animate () {
      
          // other code
      
          if (object) {
              object.rotateOnAxis(axis, speed);
          }
      }
      

      【讨论】:

        【解决方案3】:

        看看 Object3D 的rotateOnAxis(axis, angle) 函数。 它应该是这样的:

        //declared once at the top of your code
        var axis = new THREE.Vector3(0.5,0.5,0);//tilted a bit on x and y - feel free to plug your different axis here
        //in your update/draw function
        rad += radIncrement;
        object.rotateOnAxis(axis,rad);
        

        HTH

        【讨论】:

        • 谢谢老兄,但它仍然在 (0,0,0) 点旋转,轴方向!看到这个:threejs.org/examples/canvas_geometry_cube.html我想要这样的东西,但不使用相机旋转,加上我的对象远离(0,0,0)
        • 您可能想重新表述您的问题:我以为您想在任意轴上旋转。再次阅读您的问题和您的评论后,听起来您想将多个对象作为一个组旋转到组的中心。您可以轻松地做到这一点,首先创建您的组并在设置时使用组的轮换:var group = new THREE.Object3D();group.add(object1);group.add(object2);object2.x = 100 在您的代码顶部,然后只需 group.rotation.y += radians
        • 是的,你明白了我的目的,但如果你再次阅读我的问题,我说,我试过group.rotation.y += deg,但它不会围绕组中心旋转!它围绕 (0,0,0) 旋转
        • 当然可以,这是默认行为。您有两个选择: 1. 创建一个翻译矩阵并将其应用于组。选项 2,这对您来说可能更容易,使用另一个组 (2) 来嵌套第一个 (1)...翻译 group1(包含您的对象的那个)并旋转包含 group1 的 group2。
        • 当然!我向您热烈推荐this course。解释得很好,有练习,而且都使用了three.js。第 4 章:转换就是你所追求的
        猜你喜欢
        • 2015-06-15
        • 2017-10-01
        • 1970-01-01
        • 2012-05-31
        • 1970-01-01
        • 1970-01-01
        • 2013-04-25
        • 2015-01-06
        • 1970-01-01
        相关资源
        最近更新 更多