Device Orientation Controls on Android - Samsung devices

[mlehel]

Description of the problem

Hi,

I have an issue using the Device Orientation Controls on Android and especially on Samsung Galaxy phones (I've tried with an S4 and an S6). Tilting the phone forward and backward works just fine, but holding it in front of you and trying to look left and right is very laggy and unstable. For instance in a simple left move, it moves over the edge to the left, then goes back to the right a bit. Can anyone confirm they see this issue? I've managed to easily replicate it with the two Device Orientation Controls examples on threejs.org

Kind Regards, Lehel

Three.js version

• [x] Dev
• [x] r75
• [ ] ...

  Browser

• [ ] All of them
• [x] Chrome
• [ ] Firefox
• [ ] Internet Explorer

  OS

• [] All of them
• [ ] Windows
• [ ] Linux
• [x] Android
• [ ] IOS

  Hardware Requirements (graphics card, VR Device, ...)

[mrdoob]

I've noticed that too. Hopefully we'll be able to stop relying on DeviceOrientationControls when WebVR lands...

[mlehel]

Yes, that would be the best solution. Do you have any workaround until then? Any recommendations?

There are experimental versions of WebVR for Chromium and Firefox. Do you plan on building something for three.js on these versions?

[mrdoob]

Yes, that would be the best solution. Do you have any workaround until then? Any recommendations?

Not really no...

There are experimental versions of WebVR for Chromium and Firefox. Do you plan on building something for three.js on these versions?

We already support the latest version of the WebVR spec. Take a look at the webvr_* examples.

[mlehel]

Thank you very much! I overlooked your WebVR examples, sorry, I'll take a look at that!

[pontusarmini]

I think I have found a solution to this issue: to get the correct values on a Samsung (Android?) device you need to adjust for the screen orientation one step further. I have used Gyronorm.js (built upon Full-tilt) as a quick fix in the Device Orientation Controls, but it could of course be implemented without using those dependencies. But if you want a quick solution, @mlehel, replace the normal 'deviceorientation'-listener with Gyronorm and "screenAdjusted" set to true . Something like this:

var gn = new GyroNorm();
var args = {
  //other settings here
  screenAdjusted:true           
};
gn.init(args).then(function(){
  gn.start(function(data){
    //Set the device orientation control values here
    scope.deviceOrientation.alpha = data.do.alpha;
    scope.deviceOrientation.beta = data.do.beta;
    scope.deviceOrientation.gamma = data.do.gamma;
  });
}).catch(function(e){
  // Catch if the DeviceOrientation or DeviceMotion is not supported by the browser or device
});

I've made quick tests on a Galaxy S7 Edge and a Nexus 5 and they both work fine.

\ EDIT -- While testing I still get erratic, shaky results on the Samsung sometimes. Seems to be the alpha values only. Investigating further **

[mlehel]

Thank you very much for this quick solution! I'll test it as soon as possible, but it seems like a viable option!

[pontusarmini]

I've found a very good solution: Sensor fusion and motion prediction by @borismus . It's implemented in his WebVr polyfill (in use by e.g. A-Frame). After replacing the Device Orientation Controls with the FusionPoseSensor everything runs steadily and smoothly on the Samsung.

[DaClone]

Very interesting find. I'm having the exact same issues you are describing and I'll make sure to check this out, thank you!

[mlehel]

WebVR will be an option, but right now CrossWalk does not support WebVR v1.0, they are working on it though, hopefully there will be an update soon. You can find more details here: https://github.com/infil00p/cordova-crosswalk-engine/issues/43

[dustinkerstein]

I'm interested in using the FusionPoseSensor as I am having similar issues on an S7 (see #9748). Do you have any code samples of an three.js project using FusionPoseSensor to control the camera?

Edit - Ah, this seems to be built into polyfill, correct? So if you are using polyfill + VRControls you are using FusionPoseSensor, right?

Thanks, Dustin

[borismus]

Yes, see webvr-polyfill.

On Tue, Sep 27, 2016 at 11:40 AM dustinkerstein notifications@github.com wrote:

I'm interested in using the FusionPoseSensor as I am having similar issues on an S7 (see #9748 https://github.com/mrdoob/three.js/issues/9748). Do you have any code samples of an three.js project using FusionPoseSensor to control the camera?

Thanks, Dustin

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/mrdoob/three.js/issues/8524#issuecomment-249957491, or mute the thread https://github.com/notifications/unsubscribe-auth/AAQ8gE0QdKSHZjH0shd_tkB1TNXHp7uzks5quWMMgaJpZM4H-xub .