Closed verybigelephants closed 8 years ago
Yes it is a normal thing :)
In short, this happens because the emulation in the Chrome dev console is not 100% same as the real device. Below some use cases, details and work arounds
1) On a Mac Book Pro
The Mac Book Pro actually has gyroscope. So the DeviceOrientation will be fired. But you will only see alpha
values change. You can still use the emulator in the developer console. More about this below.
2) On a desktop with the developer console open but emulator NOT checked I think this is the scenario you experience. Since the hardware does not have gyroscope, you will get "DeviceOrientation is not supported"
3) On a desktop with the developer console open but emulator IS checked This kind of tricky. You expect that since Chrome is emulating the device orientation you expect it to work as a real device. But there is one difference: If you first turn on the device emulator and load the page. Chrome will not fire the deviceorientation event until you first move the block in the emulator. And Gyronorm will think deviceorientation is not supported.
Workaround1:
Workaround 2:
Workaround 3: You can use a device orientation emulator DOE https://github.com/richtr/doe
Workaround 4: Use a real device :) This is what I normally do. There are remote debug tools build in Safari for iOS. And also you can use PushBullet app to send to your devices.
There is also a closed thread about this here: https://github.com/adtile/Full-Tilt/issues/7
I hope these help. Cheers, Doruk
Let me know if this is useful so I can close the issue. Cheers, D.
thanks for your response! thanks for the workaround so i can debug things out in the browser
however, i can't seem to get it working on a real device neither. i can make it work on iphone 5 but on my android i get "devicemotion not supported". however, i can access the gyroscope values via other library (gyro.js) and via deviceorientation just fine
what can i do with this devicemotion error message? i only need to access the orientation of the device
Hello, There can be many reasons for that indeed :) Can you post the related code piece here so I can have a look. Cheers, D.
i am using this demo code http://pastebin.com/VFtiRQFY
Hi, I test this code on a Samsung Galaxy S6 and it worked as expected. Which phone and Android version are you testing it with?
P.s. Here is the code that I tested. Just removed the default args. Since you are not changing them you don't need them.
<!doctype html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no" />
<script type="text/javascript" src="//code.jquery.com/jquery-1.12.0.min.js"></script>
<script src="bower_components/gyronorm/dist/gyronorm.complete.js"></script>
<title></title>
</head>
<body>
<div id="main">
<div class="stats" style="position:absolute; left:0;top:0; color:red;"></div>
</div>
<script type="text/javascript">
var gn = new GyroNorm();
gn.init().then(function(){
alert('success');
gn.start(function(data){
$(".stats").html(
'alpha: '+data.do.alpha+', beta:'+data.do.beta+', gamma:'+data.do.gamma
);
});
}).catch(function(e){
alert(e);
});
</script>
</body>
</html>
@verybigelephants how id it go? If all is good I want to close this issue. Can you please let me know. Cheers, Doruk
hey there, i just wanted to let you know that i have tried to, but haven't managed to get the phone that i was testing it on running again, so i guess nevermind :(
I am trying to get this running on iOS 10 on an iphone 7 plus. https://codepen.io/jedierikb/project/editor/ZvoNYX/#
Getting the error 'DeviceOrientation is not supported'. Any suggestions?
looks like this is the issue: https://developer.mozilla.org/en-US/docs/Web/API/Detecting_device_orientation
Warning: Firefox (including Firefox for Android) and Safari [...] does not dispatch deviceorientation event to cross-origin pages in iframes.
@jedierikb thanks for the info. Let me know if you have any other questions.
if you fire up chrome debug console, or open the website on chrome on my android browser i get "DeviceOrientation is not supported"
is this a normal thing? i get this even when running the demos