Three.js 设备方向控制：限制或禁用 XY 旋转答案

【问题标题】：Three.js Device Orientation Controls: Limit or disable XY rotationsThree.js 设备方向控制：限制或禁用 XY 旋转
【发布时间】：2015-06-30 12:55:05
【问题描述】：

我正在使用 DeviceOrientationControls 在 Three.js 中附加和旋转一个对象

默认情况下，这些控件将在所有三个 XYZ 轴上旋转对象。

有没有什么办法可以禁用X轴和Y轴的旋转，让物体只响应Z轴的旋转？

希望这足够清楚，如果您需要示例，请告诉我。谢谢。

【问题讨论】：

标签： javascript three.js device-orientation

【解决方案1】：

对于任何感兴趣的人，我都能够在不使用三个 DeviceOrientationControls 库的情况下实现这一目标。

您可以为“deviceorientation”添加一个事件侦听器，并将伽马旋转输入到对象旋转中，如下所示：

window.addEventListener('deviceorientation', function(e) {
  var gammaRotation = e.gamma ? e.gamma * (Math.PI / 180) : 0;
  bottleGroup.rotation.y = gammaRotation;
});

【讨论】：

【解决方案2】：

您可以通过在 setObjectQuaternion(scope.object.quaternion, alpha, beta, gamma, orient); 后面添加以下行来替换 DeviceOrientationControls js；在 this.update 函数中：

this.object.rotation.x = 0;
this.object.rotation.z = 0;

然后你只在 y 方向上获得了相机运动。

【讨论】：