在这里工作(不规律)rubik的立方体
http://codepen.io/theonepa1/full/fzAli
问题是什么
从上面的链接可以看出,边缘上较小的立方体以随机方式移动(至少不是我预期的那样)
我做了什么.
在尝试旋转面部时,我将属于面部的9个立方体分组为子节点添加到新的Object3D对象中.然后我
使用object3d.rotate.x(或y或z)沿其轴旋转object3d.
我调试了什么
我确保我为第二次面部旋转选择的立方体是正确的.第一次面部旋转完成后,我更新了他们的
虚拟位置(不是实际坐标).因此,对于第二个面旋转,我已经验证了正确选取了立方体.
实际发生了什么
我做的一个观察是,在object3d(父亲持有9个面的立方体)旋转之后,立方体(较小的)轴被改变.并且
面旋转后立方体的坐标不会自动更新.比如说,如果其中一个立方体在面部之前具有(0,22)坐标
旋转,即使旋转后坐标也相同.但是,立方体的轴的方向改变了.
围绕轴旋转一组对象的最佳方法是什么?使用Object3D是否正确?
我们是否应该将孩子从一个父母中删除,然后再将其添加到另一个组进行第二次面部轮换?
我是否需要对各个立方体进行某种更新,然后再将它们添加到第二组以进行第二次面旋转?
我已经阅读了一些关于applyMatrixWorld的帖子,但我真的无法理解它对轴方向的影响
和立方体的坐标?
你能告诉我在哪里可以阅读像applyMatrixWorld这样的概念,它是一种常见的概念吗?
正常的3D编程?
这是一个非常长的问题.非常感谢你的回复:)
解决方法
您需要从作为场景的孩子的所有27个立方体开始.
让pivot成为Object3D().
让active成为包含要旋转的9个多维数据集的数组.现在使多维数据集成为数据透视表的子项:
pivot.rotation.set( 0,0 ); pivot.updateMatrixWorld(); for ( var i in active ) { THREE.SceneUtils.attach( active[ i ],scene,pivot ); }
然后,在旋转之后,将立方体作为场景的孩子放回去.
pivot.updateMatrixWorld(); for ( var i in active ) { cubes[ i ].updateMatrixWorld(); // if not done by the renderer THREE.SceneUtils.detach( active[ i ],pivot,scene ); }
阅读SceneUtils.js源代码,以便了解正在发生的事情.
这些实用程序可以在/examples/js/utils/SceneUtils.js中找到.此文件必须添加到您的项目中.
three.js r.96