我正在努力解决这个问题。
在我的场景中,我有一个相机,它可以观察物体的质心。我有一些按钮可以沿着围绕对象的不可见球体(恒定半径)在特定视图(前视图、后视图……)上设置相机位置。
当我单击按钮时,我希望相机从其起始位置沿球体表面移动到结束位置。当相机移动时,我希望它保持固定物体的质心。
有没有人知道如何实现这一目标?
感谢帮助!
如果您很高兴/更喜欢使用基本三角函数,那么在您的初始化部分中,您可以这样做:
var cameraAngle = 0;
var orbitRange = 100;
var orbitSpeed = 2 * Math.PI/180;
var desiredAngle = 90 * Math.PI/180;
...
camera.position.set(orbitRange,0,0);
camera.lookAt(myObject.position);
然后在你的渲染/动画部分你可以这样做:
if (cameraAngle == desiredAngle) { orbitSpeed = 0; }
else {
cameraAngle += orbitSpeed;
camera.position.x = Math.cos(cameraAngle) * orbitRange;
camera.position.y = Math.sin(cameraAngle) * orbitRange;
}
当然,您的按钮会修改原来的desiredAngle
值(大概是 0°、90°、180° 或 270°),您需要围绕正确的平面旋转(我正在围绕上面的 XY 平面旋转),并且您可以使用orbitRange
直到orbitSpeed
你开心为止。
您还可以orbitSpeed
在它沿着轨道路径移动时进行修改,以各种cameraAngle
s 加速和减速以获得更平稳的行驶。此过程称为“补间”,如果您想了解更多信息,可以搜索“补间”或“补间”。我认为 Three.js 有补间支持,但从未研究过。
哦,还要记住将相机的far
属性设置为大于,orbitRadius
否则您将只能看到对象的前半部分,并且根据它是什么,这可能看起来很奇怪。