三个 js 对象旋转 y 旋转 z 代替

问题描述

我真的不明白为什么会这样,但让我从头开始:

我在平面上有这个手指纹理,在空闲旋转时手指指向 Y+

enter image description here

我希望它指向 X+ 所以这是我所做的:

1- 我首先通过为 x 轴添加 -90 使手指指向 Z+

enter image description here

完全符合我的预期!

2- 问题是,我将 y 设置为 90 并希望它在 Y 轴上旋转,但它在 Z 轴上旋转,这就是我得到的:

enter image description here

它仍然指向 Z+,改变 y 旋转没有按预期工作!

在这里做错了什么?如何让它指向Z+?

解决方法

可能的错误

  • Plane Object3D 是旋转的 PlaneHolder Object3D 的子级,因此当您旋转 Plane 时,它只会在它的父级的本地空间,所以它会表现得很奇怪。使用 Plane.rotateOnWorldAxis(new Vector3(0,1,0),THREE.Math.degToRad(90)); 在世界轴上旋转平面。
  • 在您提供的第一张图片中,y 轴蓝色指向相反的方向,但在第二/第三张图片中,它指向正确的方向。
  • 在您提供的第一张图片中,x 轴 红色 提示箭头指向相反的方向,如果您在 x 轴上旋转 90 度,它应该指向 Z+ 但它是指向 Z-,所以即使第二张图片也是错误的

提示

Three.js Axis-Helper 有 3 种颜色(红色:x 轴,绿色:y 轴,蓝色:z轴),默认选项是=>红色指向右侧,绿色指向上方,蓝色指向相机(如果在V3(0,5)上添加相机并查看在具有轴助手的 V3(0,0) 处)