如何解决三.js ellipse.setRotationFromAxisAngle 消除了现有的四元数
我目前正在开发一个 Three.js 项目。
其中一项任务是围绕局部x轴和z轴为rx和rz旋转椭圆强>度;然后沿全局轴 (0,1,0) 旋转 ry 度。 我的代码是这样的:
function createOrbit(ax,xRadius,yRadius,rx,ry,rz){
const curve = new THREE.EllipseCurve(
ax,// ax,aY
xRadius,// xRadius,yRadius
0,2 * Math.PI,// aStartAngle,aEndAngle
false,// aClockwise
0 // aRotation
);
const points = curve.getPoints( 50 );
const geometry = new THREE.BufferGeometry().setFromPoints( points );
const material = new THREE.LineBasicMaterial( { color : 0xffff00 } );
// Create the final object to add to the scene
const ellipse = new THREE.Line( geometry,material );
ellipse.rotation.x += rx;
ellipse.rotation.z += rz;
yax = new THREE.Vector3(0,0);
ellipse.setRotationFromAxisAngle(yax,ry);
return ellipse;
}
然而,我发现函数ellipse.setRotationFromAxisAngle(yax,ry)
会消除现有的并重新引入一组由
ellipse.rotation.x += rx;
ellipse.rotation.z += rz;
有什么建议可以解决这个问题吗?
解决方法
是的,发生这种情况是因为任何名为 .set()
的方法自然会覆盖之前的状态。您需要做的是访问 Quaternion
(这是一个计算所有旋转的数学对象)并将其乘以一个新的:
ellipse.rotation.x += rx;
ellipse.rotation.z += rz;
// Create new rotation object
const yQuaternion = new THREE.Quaternion();
yQuaternion.setFromAxisAngle(yax,ry);
// Multiply the ellipse's rotation with the y-axis rotation
ellipse.quaternion.multiply(yQuaternion);
您可以在此处阅读有关四元数的更多信息:https://threejs.org/docs/#api/en/math/Quaternion
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。