三.JS，如何配置相机不倒模？答案

【问题标题】：Three.JS, How to configure the camera to do not upside down the model?三.JS，如何配置相机不倒模？
【发布时间】：2023-03-20 07:20:01
【问题描述】：

我正在使用 Three.JS 和 Collada loader 制作建筑物的 3D 模型。

我正在改进我的系统交互性，但我有两个主要问题：

1- 当我在场景中旋转模型时，它会在 3 轴上旋转并使其倒置！我想将模型固定在水平轴上，并且只沿 Y 轴（向上）旋转它。

A live sample我如何才能仅围绕 Y 轴（向上）旋转这个立方体？

2-如何使用鼠标移动对系统进行平滑控制？例如在大模型中，平滑缩放到特定的小对象并不容易。如何配置相机以平滑缩放、平移和旋转？

谢谢

【问题讨论】：

嗨，我是 3JS 的初学者。我想知道您是如何创建建筑物的 3D 模型的？
我使用 Autodesk Revit 创建了一个 IFC 文件。然后我使用 Blender 将 IFC 文件导出到 Collada。有一个可以读取 IFC 的 Blender 插件，您可以轻松地将其导出到 Collada。您还可以使用 Sketch up 创建 Collada 文件。

标签： javascript three.js webgl interactive collada

【解决方案1】：

您没有旋转模型。您正在旋转相机。

使用OrbitControls 而不是TrackballControls——这将使相机保持正面朝上。

OrbitControls 应该是平滑的。如果不是，那么您的模型可能有问题。这只能根据具体情况来处理。

您正在使用已使用一年的库版本。更新到当前版本是明智之举。

three.js r.57.

【讨论】：

【解决方案2】：

在脚本中添加以下内容：

controls.getMouseProjectionOnBall2 = controls.getMouseProjectionOnBall;
controls.getMouseProjectionOnBall = function(x, y){
    return controls.getMouseProjectionOnBall2.call(controls, x, controls.screen.height/2);
}

关于生涩的动作，我看到你已经做了所有可能的事情（人们经常忽略 requestAnimationFrame）。我认为除了降低建筑物的复杂性之外，您无法采取任何措施来减少抖动。

【讨论】：