首页 > 解决方案 > 如何选择一个对象并将相机移动到另一个位置?

问题描述

我有一个问题,我不知道如何选择所选内部场景的位置并将相机移动到其中

我找到了一个项目示例,我想构建一个类似的示例

示例项目

太感谢了!

标签: three.js

解决方案


你基本上分两步解决这个问题:

首先,您必须使 3D 对象可选择,这可以通过光线投射来完成。有很多官方示例演示了基于光线投射的 3D 交互,例如:

https://threejs.org/examples/webgl_interactive_cubes

如果您知道单击了某个 3D 对象,则可以将相机从其当前位置设置为动画到定义的目标位置。可以预先定义可能的目标位置,或者您可以根据对象的包围体和当前相机位置以某种方式动态计算目标位置。实际的动画可以通过多种方式完成。一种方法是使用像tween.js这样的补间引擎。查看以下示例以了解它如何与 一起使用three.js

https://threejs.org/examples/css3d_periodictable


推荐阅读