将Sketchup中的交互式模型导出为three.js

Question

我已经使用Google Sketchup设计了我的3D模型，我的模型包含场景和动态移动，换句话说，我的模型响应用户点击（点击模型然后模型移动或做某事）我的查询是如果我将我的模型上传到three.js，它是否仍然与用户交互，或者只是作为一个实体查看（不响应点击）。很长一段时间，我是否正在寻求有关此主题的帮助，如果有可能的方法，那么如何？

Answer 1

步骤1.将Sketchup模型加载到Three.js

您可以从sketchup导出，例如.obj，并将模型文件加载到Three.js中。 this SO thread中有一个例子。这不会传输您提到的任何动画或“点击逻辑”。我认为没有办法转移这种应用程序逻辑。

步骤2.检测点击事件

将对象导入Three.js场景后，您需要检测 当用户点击一个对象时。 您可以通过将光线投射到场景中来“拾取”。 Three.js有一个Raycaster类来完成它。 Here is an example了解如何使用Raycaster。

步骤3.动画对象

在您的某个对象上获得click事件后，就可以为其设置动画了。在场景中有两种动画对象的方式： 首先，您可以在场景图级别执行刚性动画：如果您有一个框，则可以移动 通过你的场景。盒子移动，旋转，可能是鳞片，但它不会改变它的形状。

然后有非刚性动画这是人类最有机的东西 人物呢。这种类型的动画不是在场景图级别完成的，而是由 转换个别顶点。 Here is an example了解如何使用顶点蒙皮进行此操作。

---

场景图级别的动画可以说比蒙皮动画简单。如果你刚刚开始，你应该专注于这种更简单的动画类型。