模型对象可能是一个网格模型对象,也能是包含多个网格模型的层级模型对象。
平移几何体
如果想改变一个网格模型对象的默认旋转轴,平移网格模型对象的几何体Geometry可以改变,主要不能平移网格模型本身,平移网格模型对象本身,执行网格模型的旋转方法并不会影响自身旋转轴的位置。比如通过threejs的BoxGeometry
类创建一个立方体几何体,执行.rotateY()
旋转方法,默认的旋转轴位置位于立方体的几何中心,如果通过几何体的平移方法translate ()
改变几何体顶点的位置坐标,就可以改变网格模型旋转轴默认的旋转位置。
var box=new THREE.BoxGeometry(56,56,56);
// 平移几何体,改变旋转轴
box.translate ( 28, 0, 0 );
var mesh=new THREE.Mesh(box,material);
// 平移网格模型,不影响mesh自身的旋转轴
mesh.position.set(65,23,0)
// 立方体旋转动画效果
function render() {
renderer.render(scene,camera);
//每次绕y轴旋转0.01弧度
// 不平移几何体,绕立方体的几何中心旋转
// 平移距离是变长的一半,绕立方体侧边线旋转
mesh.rotateY(0.1);
requestAnimationFrame(render);
}
render();
嵌套父对象
如果是多个网格模型组成一个模型对象,分别去平移每个网格模型对应的几何体可能比较麻烦,对于这种情况也可以给该模型对象嵌套一个父对象,然后把该模型对象相对于父对象平移一定距离,然后旋转该模型的父对象,不旋转模型本身,可以看到该模型的旋转效果,视觉效果上旋转轴改变了。
// 加载mesh是外部加载得到模型对象
var box=new THREE.BoxGeometry(50,50,50);
box.translate ( 25, 0, 0 );
var mesh=new THREE.Mesh(box,material);
var group = new THREE.Group()
// group作为mesh的父对象
group.add(mesh)
// mesh相对父对象沿着x方向平移-25
mesh.position.x= -25
scene.add(group);
// 立方体旋转动画效果
function render() {
renderer.render(scene,camera);
// mesh.rotateY(0.1);
group.rotateY(0.1);//旋转mesh的父对象
requestAnimationFrame(render);
}
render();