Compass (North) sensor in C3

0 favourites
  • 5 posts
From the Asset Store
Firebase Analytics
$3 USD
50% off
[C2] [C3] Support C3 build service and Android 14
  • hi, I have 2 questions:

    I Have a project that uses cordova-plugin-device-orientation, but now I discovered that this plugin is(will be) deprecated. I need to know if :

    1) C3 is able to compile with plugin cordova included or not yet?

    2) Is Alpha indication in gyro sensor in C3 plugin, can indicates north direction or only heading?

    This topic blog.phonegap.com/migrating-from-the-cordova-device-orientation-plugin-8442b869e6cc

    gives solution to get compass direction, but I want to know if I can get access to compass noth directy from C3.

    Thank you.

  • I have been using a relative compass heading in C3 for a 360 viewer on mobile.

    You might try and check if it's absolute though (depending on what you need.)

    Check out Touch.Alpha, Beta, Gamma

    construct.net/en/make-games/manuals/construct-3/plugin-reference/touch

    To convert to a stable compass heading I use JS in a function:

    * On function 'compassHeading'

    * Parameter 'alpha' (Number)

    * Parameter 'beta' (Number)

    * Parameter 'gamma' (Number)

    -> Run JavaScript:

    var alpha = localVars.alpha;
     var beta = localVars.beta;
     var gamma = localVars.gamma
     // Convert degrees to radians
     var alphaRad = alpha * (Math.PI / 180);
     var betaRad = beta * (Math.PI / 180);
     var gammaRad = gamma * (Math.PI / 180);
    
     // Calculate equation components
     var cA = Math.cos(alphaRad);
     var sA = Math.sin(alphaRad);
     var cB = Math.cos(betaRad);
     var sB = Math.sin(betaRad);
     var cG = Math.cos(gammaRad);
     var sG = Math.sin(gammaRad);
    
     // Calculate A, B, C rotation components
     var rA = - cA * sG - sA * sB * cG;
     var rB = - sA * sG + cA * sB * cG;
     var rC = - cB * cG;
    
     // Calculate compass heading
     var compassHeading = Math.atan(rA/rB);
    
     // Convert from half unit circle to whole unit circle
     if(rB < 0) {
     compassHeading += Math.PI;
     }else if(rA < 0) {
     compassHeading += 2 * Math.PI;
     }
    
     // Convert radians to degrees
     compassHeading *= 180 / Math.PI;
    
     runtime.setReturnValue(compassHeading);
    
    

    On iOS 13 you also need to request permissions at least when using Safari. Here's my ugly UI method. If you find a better way, please let me know.

    + System: On start of layout

    + PlatformInfo: Is on mobile

    -> Run JavaScript:

    // Create the button
    var button = document.createElement("button");
    button.innerHTML = "Tap to Request Orientation Permission";
    button.id = "RequestOrientation"
    button.style.position = "relative"
    //button.style.left = "50%"
    //button.style.right = "50%"
    button.style.height = "600px"
    button.style.width = "360px"
    button.style.fontSize = "xx-large"
    // Append 
    var body = document.getElementById("fb-root")
    // var body = document.getElementsByTagName("body")[0];
    body.appendChild(button)
    // Add listenr
    button.addEventListener ("click",requestT)
     
     function requestT () {
    		console.log("***INFO*** RequestingDOE")
    		document.getElementById("RequestOrientation").remove()
     	if (typeof(DeviceMotionEvent) !== 'undefined' && typeof(DeviceMotionEvent.requestPermission) === 'function') {
     DeviceMotionEvent.requestPermission()
     .then(response => {
     if (response == 'granted') {
    				console.log("***INFO*** DOE Granted")
    				runtime.globalVars.requestPermission = true
     	window.addEventListener('devicemotion', (e) => {
     	// do something with e
     	})
     }
     	}
     )
     .catch(console.error)
     }
     }
    
  • Thank you Mikal, I give it a try and feeedback later.

  • Hi Mikal,

    I think you code is linked only to Gyroscope compass and not magnetic compass.

    The plugin I used is cordova-plugin-device-orientation, now I learn that this plugin is/will be deprecated, and it will be supported in browser like touch and gyroscope.

    Thanks for your code, I was looking for it but not in this case.

  • Try Construct 3

    Develop games in your browser. Powerful, performant & highly capable.

    Try Now Construct 3 users don't see these ads
  • Yes, I thought it might be relative, not absolute.

    You might take a look at this (use JS integration to access it), there are some comments on absolute orientation.

    developerdrive.com/how-to-use-the-device-orientation-api

Jump to:
Active Users
There are 1 visitors browsing this topic (0 users and 1 guests)