Eventos de orientación del dispositivo

Internet Explorer 11 agrega compatibilidad para eventos DOM que proporcionan información sobre la orientación física y el movimiento de un dispositivo, tal y como se define en la nueva especificación del evento DeviceOrientation del W3C. Los eventos de orientación y movimiento del dispositivo de IE11 permiten usar los sensores de dispositivo modernos para explorar nuevos mecanismos de entrada para juegos, nuevos gestos para aplicaciones (como "sacudir para limpiar la pantalla" o "inclinar para aumentar la imagen") e incluso experiencias de realidad aumentada.

Importante  Esta característica no se admite en IE11 en Windows 7.

La especificación de eventos DeviceOrientation del W3C define dos tipos diferentes de datos de sensor: orientación y movimiento.

Eventos de orientación del dispositivo

Cuando la orientación física del dispositivo cambie (porque el usuario lo incline o lo gire) 0,01 grados o más, Internet Explorer activa el objeto DeviceOrientationEvent en window. Los datos que proporciona el objeto DeviceOrientationEvent especifican la orientación del dispositivo host con relación al sistema de coordenadas fijo de la Tierra. Concretamente, este sistema de coordenadas terrestres tiene los siguientes tres ejes:

  • Este (X), situado en el plano terrestre, perpendicular al eje Norte y positivo hacia el este.
  • Norte (Y), situado en el plano terrestre y positivo hacia el norte verdadero (hacia el Polo Norte).
  • Arriba (Z), perpendicular al plano terrestre y positivo hacia arriba.
Estos ejes X, Y y Z corresponden a las propiedades beta, gamma y alpha de DeviceOrientationEvent, respectivamente.Diagrama que muestra los ángulos alfa, beta y gamma de rotación devueltos en el evento deviceorientation relativo a los ejes 3D X, Y y Z: alfa = gira alrededor del eje Z, beta = eje X y gamma = eje Y.

El código siguiente muestra cómo usar el evento deviceorientation para guiar al usuario de manera que su dispositivo apunte al norte.


<div id="directions"></div>
<script>
    window.addEventListener("deviceorientation", findNorth);
    function findNorth(evt) {
        var directions = document.getElementById("directions");
        if (evt.alpha < 5 || evt.alpha > 355) {
            directions.innerHTML = "North!";
        } else if (evt.alpha < 180) {
            directions.innerHTML = "Turn Left";
        } else {
            directions.innerHTML = "Turn Right";
        }
    }
</script>


Eventos de movimiento del dispositivo

Cuando un dispositivo se mueve o se gira (o, más exactamente, se acelera), el objeto DeviceMotionEvent se activa en la ventana y proporciona acceleration data (tanto with como without los efectos de la aceleración gravitacional sobre el dispositivo, expresados en m/s2) en los ejes x, y y z así como rotational rate of change data en los ejes de rotación alpha, beta y gamma (expresados en grados/s). Las rotaciones usan la regla de la mano derecha, por la que una rotación positiva alrededor de un eje se realiza en el sentido de giro de las agujas del reloj cuando se mira hacia la dirección positiva del eje.

En el ejemplo siguiente se muestra cómo usar el evento ondevicemotion para detectar y notificar los movimientos del dispositivo por encima de un umbral especificado.


<div id="status"></div>
<script>
    window.addEventListener("devicemotion", detectShake);
    function detectShake(evt) {
        var status = document.getElementById("status");
        var accl = evt.acceleration;
        if (accl.x > 1.5 || accl.y > 1.5 || accl.z > 1.5) {
            status.innerHTML = "EARTHQUAKE!!!";
        } else {
            status.innerHTML = "All systems go!";
        }
    }
</script>


Calibrar la brújula

El eventocompassneedscalibration se desencadena cuando el usuario tiene que calibrar la brújula del dispositivo host para proporcionar datos más precisos desde elDeviceOrientationEvent.

La implementación de IE para este evento se desencadena siempre que el magnetómetro del dispositivo host cambia a un estado de precisión no fiable o aproximada, según define la enumeraciónMagnetometerAccuracy del espacio de nombres Windows.Devices.Sensors.

Referencia de API

DeviceOrientationEvent
DeviceMotionEvent

Especificación

Especificación del evento DeviceOrientation

 

 

Mostrar:
© 2014 Microsoft