Forum

gyroscope rotation angles

11 February 2016 21:40
Hi!
we tried to use the gyroscope module with the eye camera. We didn't manage to use it for our purpose.
It seems that only 2 rotation angles BETA and GAMMA are supported and we have not been able to control the z angle ALPHA (as described here: http://www.w3.org/TR/orientation-event/)

any hint?
thanks!
Luigi
12 February 2016 03:27
You can use something like this.

//...
var m_cam = require("camera");
var m_ctl = require("controls");
var m_quat = require("quat");
var m_scenes = require("scenes");
var m_trans = require("transform");
var m_util = require("util");
var m_vec3  = require("vec3");

var _last_gyro_quat = m_quat.create();

var _quat_tmp = m_quat.create();
var _quat_tmp2 = m_quat.create();
var _vec3_tmp = m_vec3.create();
// ...
function create_rotation_sensors() {
    var obj = m_scenes.get_active_camera();
    var g_sensor = m_ctl.create_gyro_angles_sensor();
    var save_angles = true;

    var rotate_cb = function(obj, id, pulse) {
        if (pulse > 0) {

            var curr_angles = m_ctl.get_sensor_payload(obj, id, 0);
            if (m_cam.is_eye_camera(obj)) {
                var alpha = curr_angles[2];
                var beta  = curr_angles[1];
                var gamma = curr_angles[0];

                // 1) Using alpha, beta, gamma set up quaternion in local space.
                // http://w3c.github.io/deviceorientation/spec-source-orientation.html
                var quaternion = _quat_tmp;
                var c1 = Math.cos(alpha / 2);
                var c2 = Math.cos(beta  / 2);
                var c3 = Math.cos(gamma / 2);
                var s1 = Math.sin(alpha / 2);
                var s2 = Math.sin(beta  / 2);
                var s3 = Math.sin(gamma / 2);
                quaternion[0] = c1 * s2 * c3 - s1 * c2 * s3;
                quaternion[1] = c1 * c2 * s3 + s1 * s2 * c3;
                quaternion[2] = s1 * c2 * c3 + c1 * s2 * s3;
                quaternion[3] = c1 * c2 * c3 - s1 * s2 * s3;

                // 2) Get a screen rotation quaternion (use windows.orientation). window.orientation is undefined in desktop browsers
                var orientation = Math.PI * window.orientation / 180;
                var screen_quat = m_quat.setAxisAngle(m_util.AXIS_Z,
                        -orientation, _quat_tmp2);

                // 3) Multiply quaternion from item 1) to quaternion from item 2)
                quaternion = m_quat.multiply(quaternion, screen_quat, _quat_tmp);

                // 4) WebGL world space quaternion
                var quat = m_quat.setAxisAngle(m_util.AXIS_X, Math.PI / 2,
                        _quat_tmp2);
                // 5) Multiply quaternion from item 3) to quaternion from item 4)
                quaternion = m_quat.multiply(quaternion, quat, _quat_tmp);

                // Some behavior stuff
                if (save_angles) {
                    m_quat.copy(quaternion, _last_gyro_quat);
                    save_angles = false;
                } else {
                    var last_gyro_inv_quat = m_quat.invert(_last_gyro_quat, _last_gyro_quat);
                    var cam_quat = m_trans.get_rotation(obj, _quat_tmp2);
                    var clear_cam_quat = m_quat.multiply(cam_quat, last_gyro_inv_quat, _quat_tmp2);
                    var new_cam_quat = m_quat.multiply(clear_cam_quat, quaternion, _quat_tmp2);

                    var up_axis = m_vec3.transformQuat(m_util.AXIS_MZ,
                            new_cam_quat, _vec3_tmp);
                    // 6) Set up vertical axis. 
                    m_cam.set_vertical_axis(obj, up_axis);
                    // 7) Set up rotation quaternion to camera
                    m_trans.set_rotation_v(obj, new_cam_quat);
                    m_quat.copy(quaternion, _last_gyro_quat);
                }
            }
        }
    }
    m_ctl.create_sensor_manifold(obj, "ROTATE_GYRO", 
            m_ctl.CT_CONTINUOUS, [g_sensor], null, rotate_cb);
}

};
Blend4Web Team
kirill@blend4web.com
15 February 2016 13:08
The code you provided works great! Thank you very much.
In android chrome mobile the rotation is now perfect.
We still have some issue with firefox mobile… it seems that firefox has a different reference point for the w3c-defined gamma angle.
15 February 2016 19:17
Ответ на сообщение пользователя luigi.verri
We still have some issue with firefox mobile… it seems that firefox has a different reference point for the w3c-defined gamma angle.

I have same behavior with mobile version of firefox. I am going to find solution tomorrow.
Blend4Web Team
kirill@blend4web.com
16 February 2016 15:50
it seems that firefox has a different reference point for the w3c-defined gamma angle
I have made bug report.
Blend4Web Team
kirill@blend4web.com
16 February 2016 17:59
Amazing.
Thank you for your valuable help.
We found this bug report too: https://bugzilla.mozilla.org/show_bug.cgi?id=878067
Somebody seems to say that chrome is wrong… Actually we don't think so !
 
Please register or log in to leave a reply.