Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to use alpha beta gamma to tell if user is portrait or landscape? #24

Open
cmhsu-cs opened this issue Jun 22, 2016 · 2 comments
Open

Comments

@cmhsu-cs
Copy link

Hi,

Do you have any idea how to do this? Currently I have something like this:

if ((newBeta > 5 && newBeta < 85) && (newGamma > -40 && newGamma < 40)) {
absoluteP.innerHTML = 'portrait';
} else if ((newBeta > -40 && newBeta < 40) && (newGamma > -85 && newGamma < -5) || ((newBeta > -40 && newBeta < 40) && (newGamma > 5 && newGamma < 85))) {
absoluteP.innerHTML = 'landscape';
}

@donbarthel
Copy link

This probably doesn't answer your question... I use alpha / beta / gamma from Chrome's 'deviceorientationabsolute' event to set a compass / pitch / roll widget but I don't use that to determine screen orientation. Instead I listen to $(window).resize() (yeah, JQuery but there's a native call too) and compare width and height of a whole-screen div:

var vpWidth = $('#whole_viewport').width();
var vpHeight = $('#whole_viewport').height();

vpWidth > vpHeight when in portrait mode.

@dorukeker
Copy link
Contributor

If you use the DeviceMotion (instead of DeviceOrientation) it returns values of gravity included accelerations. You can check the .ACCELERATION_INCLUDING_GRAVITY_ZIf it is close to 0 it means the device is up from the ground (not lying on the floor).

On top of that you can check the viewport orientation like @donbarthel suggested.

One thing to be careful: When your device is lying on the ground iPhone returns negative Z values where as Android returns positive. But in your case if your value is, lets say, between -10 and 10 you can assume the device is up from the ground. Regardless of an iPhone or Android.

I explained the device inconsistencies here https://leanpub.com/gyronormjs
Hope that helps.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants