three.js - 网格组示例?(THREE.Object3D()高级)

Dan*_*ith 36 mesh object parent-child three.js

我试图了解如何将子网格分组/链接到父级.我希望能够:

  • 拖动父级
  • 相对于父元素旋转子元素
  • 让父母轮换/翻译为孩子做正确的事

我唯一的背景是在Second Life中使用LSL来操作对象中的链接prims.我想我不想合并网格,因为我想保持对每个孩子的控制(悬停,纹理,旋转,缩放等).

有关于此的任何好的教程吗?用THREE.Object3D()实现这个,是吗?

谢谢,丹尼尔

Geo*_*nza 58

拖动会有点棘手,因为你需要弄清楚鼠标在屏幕上的x/y位置(屏幕空间)将在3D世界中,然后你需要投射光线并检查它是否与要拖动的对象相交.我认为这将是一个不同的问题.

设置对象层次结构非常简单.正如您所暗示的那样,您将使用THREE.Object3D实例将对象嵌套到使用它的add()方法中.我们的想法是,对于具有几何体的对象和Object3D实例,您将使用Mesh,您只需要嵌套元素.我建议从canvas_geometry_hierarchy示例开始.

有趣的是:

group = new THREE.Object3D();//create an empty container
group.add( mesh );//add a mesh with geometry to it
scene.add( group );//when done, add the group to the scene
Run Code Online (Sandbox Code Playgroud)

  • 看起来现在有一个可以构造的THREE.Group对象(THREE.WebGLRenderer 71). (4认同)

ato*_*tom 14

另一种方式,因为网格也可以是父网格

meshParent.add(meshChild1);
meshParent.add(meshChild2);
scene.add(meshParent);
Run Code Online (Sandbox Code Playgroud)

要么

mesh1.add(mesh2);
mesh3.add(mesh1);
scene.add(mesh3);
Run Code Online (Sandbox Code Playgroud)

mesh3操纵所有网格,mesh1操纵自身和mesh2,mesh2操纵自己