在物理引擎中使用传感器改变重力

Question

我正在寻找一种在移动设备(在Cordova应用程序)中使用传感器来改变物理引擎的行为的方法。目前正在使用PhysicsJS，但也发现matter.js作为物理引擎的候选。

在第一步中，引擎的重力应该改变，所以它不会使用设备的y方向，而是根据设备的旋转方式使用"真实"方向。之后(可选的)z方向也可以用来改变物理引擎的世界。

谁能给我提示和/或一个例子?

• 读取什么传感器(方向，加速度计，陀螺仪，重力，?)在体面的智能手机/浏览器中是否有集成的html5支持，或者添加cordova插件更好?
• 物理引擎要做什么改变来反映移动设备的新位置

环境:Cordova, Ionic, HTML5, Android>= Kitkat, iOS>= 7

我自己的发现:

我想这是deviceorientation事件最适合我的要求。一个非常原始的实现(并不令人满意)是这样的:

var acceleration = Physics.behavior('constant-acceleration')
    .setAcceleration({x: 0, y: GRAVITY * options.gravityFactor});
world.add([acceleration]);
if (window.DeviceOrientationEvent) {
    var deviceOrientationHandler = function (event) {
        world.one('step', function () {
            acceleration.setAcceleration({
                x: (90 / event.gamma) * GRAVITY,
                y: (90 / event.beta) * GRAVITY
            });
        });
    };
    window.addEventListener('deviceorientation',
        deviceOrientationHandler, false);
}

似乎一个更好的选择是计算设备关于x, y的角度，然后将重力矢量分成x和y部分。也许会更复杂。对我来说，这听起来像是一堆数学。当然，成百上千的人已经这样做了，所以你能帮我吗?

所以现在剩下的更具体的问题是:

如何在2D物理引擎中转换DeviceOrientationEvent beta和gamma到重力?

Answer 1

你试过matter.js手机版演示了吗?
http://brm.io/matter-js-mobile/

它展示了如何根据移动设备的传感器改变重力。

源代码在这里:
https://github.com/liabru/matter-js/blob/master/demo/js/DemoMobile.js

Answer 2

找到第一个解:

if (window.DeviceOrientationEvent) {
    var deviceOrientationHandler = function (event) {
        var pitch = Math.PI * event.beta / 180;
        var roll = Math.PI * event.gamma / 180;
        var acc = {
            x: Math.cos(pitch) * Math.sin(roll) * GRAVITY,
            y: Math.sin(pitch) * GRAVITY
        };
        world.one('step', function () {
            acceleration.setAcceleration(acc);
        });
    };
    window.addEventListener('deviceorientation',
        deviceOrientationHandler, false);
}

它在Android上运行得很好，但在iOS上，当手机倾斜太多时，iOS会将方向改为颠倒，然后重力似乎颠倒了。