简单VR照片使用陀螺仪、姿态角（Roll、Pitch、Yaw ）、四元数

最近在做一个类似VR照片的demo，跟全景图片也很像，只是VR照片与全景720度显示，我只做了180度。但我发现他们实现的原理有一丝相似，希望可以给一些想入行AR、VR的朋友一些提示吧。

要想根据用户摇晃手机的行为轨迹展示相应的场景，那必须要使用移动端的陀螺仪、加速器等传感器来做相应的协调。现在的移动端已经提供了很多传感器，你可以根据自己的需要获取相应的数据。

刚开始的时候，我使用传感器提供的姿态角，也称为欧拉角：pitch yaw roll 来显示。这种姿态角/欧拉角比较常用在航空上，无人机技术应该也使用到了这个技术点。我用飞机的模型来展示一下这三个角，就一目了然了（不同作者使用不同的坐标系，使用哪种坐标系，个人而定。）：

图一

姿态角/欧拉角在数学上理解起来会有点抽象，我也是稍理解一点。在维基百科上，欧拉角定义为：用来描述刚体在三维欧几里得空间的取向，对于任何参考系，一个刚体的取向，是依照顺序，从这参考系，做三个欧拉角的旋转而设定的。有兴趣了解得深入一点，可以参考(需FQ)：

我们也可以简单理解这三个角代表什么意思：

1、俯仰角θ（pitch）：围绕Y轴旋转的。

图二

2、偏航角ψ（yaw）：围绕Z轴旋转的角度。

图三

3、滚转角Φ（roll）：围绕X轴旋转的角度。

图四

手机的坐标系：

手机定义的坐标系统：X轴是水平且指向右边，Y轴是垂直且指向前方，Z轴指向屏幕的正面正上方。

当手机左右摇摆时（绕 y 轴旋转），得到变化的滚转角Φ（roll），范围为 (-90 to 90)

当手机前后摇摆时（绕 x 轴旋转），得到变化的俯仰角θ（pitch），范围为 (-180 to 180)

当手机横屏转换成竖屏或竖屏转换成横屏时（绕 z 轴旋转），即得到变化的偏航角ψ（yaw）。

当手机旋转得到相应的角度时，我们把屏幕的图片替换成相应角度的图片，这让你感觉身临其境，屏幕里的场景会跟着我们视觉和谐变化，这就是VR大概实现的原理吧。

Android提供了类似这个姿态角/欧拉角的数据，但两者有些区别，Android 把偏航角ψ（yaw）定义为方位角 Azimuth。具体可查看Android官方文档：https://developer.android.google.cn/reference/android/hardware/SensorEvent.html#values

接收的传感器类型为：Sensor.TYPE_ORIENTATION （Android官方已经摈弃，换了其它方法来获取）

使用这种方式去获取的数据有些波动，当拿着手机不动的时候，数据有时变化也比较大，所以后期我改用了四元数来处理这个问题。后来听说了一个方案，通过滤波方法，可以把姿态角/欧拉角一些波动比较大的数据过滤点，得到的数据就比较平滑了。（这个方式，我还没有去试，大家可以去了解了解）

使用 “四元数” 也可以实现。四元数理解起来也很抽象：简单的超复数，是复数的不可交换延伸。

我是这么简单理解：我们都知道向量，向量是用来形容一个二维空间的轨迹与方向，形象化地表示为带箭头的线段。四元数则表示为在一个四维空间的轨迹与方向。

来看一个四元数的表现形式：