Three.js 圆周运动 绕轴旋转
在 Three.js 中一个模型围绕一个中心做圆周运动,比如地球绕太阳公转运动。
以坐标原点为中心,绕着坐标系Y轴旋转
// 声明一个变量angle表示角度位置
let angle = 0;
function render() {
renderer.render(scene, camera);
// 每次执行渲染函数redner时候,角度累加0.005
angle += 0.005;
// 圆周运动网格模型x坐标计算 绕转半径400
var x = 400 * Math.sin(angle)
// 圆周运动网格模型y坐标计算 绕转半径400
var z = 400 * Math.cos(angle)
// 每次执行render函数,更新需要做圆周运动网格模型Mesh的位置属性
Mesh.position.set(x, 0, z);
requestAnimationFrame(render);
}
render();
如果需要改变圆周运动的中心,比如绕转轴 x 坐标 200,z 坐标 300
// 圆周运动网格模型x坐标计算
var x = 400 * Math.sin(angle)+200
// 圆周运动网格模型y坐标计算
var z = 400 * Math.cos(angle)+300
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论