如何在A帧中倒转拖动旋转？

Question

一个简单的问题。我花了4-6个小时才找到这个，但没找到。

例如，我正在构建一个全景查看器：<a-sky>

​

<script src="https://aframe.io/releases/0.3.0/aframe.min.js"></script>


<a-scene>
  <a-sky src="https://aframe.io/aframe/examples/boilerplate/panorama/puydesancy.jpg" rotation="0 -130 0"></a-sky>
</a-scene>

​

如何用鼠标拖动倒转？(从左到右，从右到左-就像这样)

Answer 1

自v0.6.0在相机上使用此属性以来，就内置了逆转拖动旋转方向的能力。

look-controls="reverseMouseDrag: true"

下面是一个例子：

​

<script src="https://aframe.io/releases/0.6.0/aframe.min.js"></script>


<a-scene>
  <a-entity camera look-controls="reverseMouseDrag: true"></a-entity>
  <a-sky src="https://aframe.io/aframe/examples/boilerplate/panorama/puydesancy.jpg" rotation="0 -130 0"></a-sky>
</a-scene>

​

注- 根据这个问题 --这仍然只适用于桌面机器上的鼠标拖动，而不适用于移动设备上的触摸拖动。

Answer 2

在引入更多可扩展控件之前，我发布了一个reverse-look-controls组件。

反向外观控件组件： https://github.com/ngokevin/kframe/tree/master/components/reverse-look-controls

演示:

​

<script src="https://aframe.io/releases/0.3.0/aframe.min.js"></script>
<script src="https://rawgithub.com/ngokevin/kframe/master/components/reverse-look-controls/dist/aframe-reverse-look-controls-component.min.js"></script>

<a-scene>
  <a-entity camera reverse-look-controls></a-entity>
  <a-sky src="https://aframe.io/aframe/examples/boilerplate/panorama/puydesancy.jpg" rotation="0 -130 0"></a-sky>
</a-scene>

​

Answer 3

在实现了0.6.0之后，我觉得这不是在一个视频圈上运行时的预期行为。

通过使用*-1修改行67607和67608，我能够获得预期的行为。

aframe-v0.6.0.js

var currentRotationX = radToDeg(this.pitchObject.rotation.x  * -1);
var currentRotationY = radToDeg(this.yawObject.rotation.y  * -1);