¿Cómo acceder a los datos del acelerómetro/giroscopio desde Javascript?

Presta atención ya que en este enunciado vas a hallar el arreglo que buscas.Esta reseña fue analizado por nuestros expertos para garantizar la calidad y exactitud de nuestro contenido.

Solución:

Actualmente hay tres eventos distintos que pueden o no activarse cuando los dispositivos del cliente se mueven. Dos de ellos se centran en orientación y el ultimo en movimiento:

• ondeviceorientation se sabe que funciona en la versión de escritorio de Chrome, y la mayoría de las computadoras portátiles de Apple parecen tener el hardware necesario para que esto funcione. También funciona en Mobile Safari en el iPhone 4 con iOS 4.2. En la función de controlador de eventos, puede acceder alpha, beta, gamma valores en los datos de eventos proporcionados como el único argumento de la función.

• onmozorientation es compatible con Firefox 3.6 y posteriores. Nuevamente, se sabe que esto funciona en la mayoría de las computadoras portátiles Apple, pero también podría funcionar en máquinas Windows o Linux con acelerómetro. En la función de controlador de eventos, busque x, y, z campos en los datos de eventos proporcionados como primer argumento.

• ondevicemotion se sabe que funciona en iPhone 3GS + 4 y iPad (ambos con iOS 4.2), y proporciona datos relacionados con la aceleración actual del dispositivo cliente. Los datos del evento pasados ​​a la función del controlador tienen acceleration y accelerationIncludingGravityque tienen tres campos para cada eje: x, y, z

El sitio web de ejemplo de “detección de terremotos” utiliza una serie de if declaraciones para averiguar a qué evento adjuntar (en un orden algo priorizado) y pasa los datos recibidos a un común tilt función:

if (window.DeviceOrientationEvent) 
    window.addEventListener("deviceorientation", function () 
        tilt([event.beta, event.gamma]);
    , true);
 else if (window.DeviceMotionEvent) 
    window.addEventListener('devicemotion', function () 
        tilt([event.acceleration.x * 2, event.acceleration.y * 2]);
    , true);
 else 
    window.addEventListener("MozOrientation", function () 
        tilt([orientation.x * 50, orientation.y * 50]);
    , true);

Los factores constantes 2 y 50 se utilizan para “alinear” las lecturas de los dos últimos eventos con las del primero, pero estos son de ninguna manera representaciones precisas. Para este simple proyecto de “juguete” funciona bien, pero si necesita usar los datos para algo un poco más serio, tendrá que familiarizarse con las unidades de los valores proporcionados en los diferentes eventos y tratarlos con respeto 🙂

No puedo agregar un comentario a la excelente explicación en la otra publicación, pero quería mencionar que aquí se puede encontrar una excelente fuente de documentación.

Es suficiente registrar una función de evento para el acelerómetro así:

if(window.DeviceMotionEvent)
  window.addEventListener("devicemotion", motion, false);
else
  console.log("DeviceMotionEvent is not supported");

con el manejador:

function motion(event)
  console.log("Accelerometer: "
    + event.accelerationIncludingGravity.x + ", "
    + event.accelerationIncludingGravity.y + ", "
    + event.accelerationIncludingGravity.z
  );

Y para el magnetómetro, se debe registrar el siguiente controlador de eventos:

if(window.DeviceOrientationEvent)
  window.addEventListener("deviceorientation", orientation, false);
else
  console.log("DeviceOrientationEvent is not supported");

con un manejador:

function orientation(event)
  console.log("Magnetometer: "
    + event.alpha + ", "
    + event.beta + ", "
    + event.gamma
  );

También hay campos especificados en el evento de movimiento para un giroscopio, pero eso no parece tener soporte universal (por ejemplo, no funcionó en un Samsung Galaxy Note).

Hay un código de trabajo simple en GitHub

La forma de hacer esto en 2019+ es usar DeviceOrientation API. Esto funciona en la mayoría de los navegadores modernos en computadoras de escritorio y dispositivos móviles.

window.addEventListener("deviceorientation", handleOrientation, true);

Después de registrar su detector de eventos (en este caso, una función de JavaScript llamada handleOrientation()), se llama periódicamente a su función de detector con datos de orientación actualizados.

El evento de orientación contiene cuatro valores:

• DeviceOrientationEvent.absolute
• DeviceOrientationEvent.alpha
• DeviceOrientationEvent.beta
• DeviceOrientationEvent.gamma

La función del controlador de eventos puede verse así:

function handleOrientation(event) 
  var absolute = event.absolute;
  var alpha    = event.alpha;
  var beta     = event.beta;
  var gamma    = event.gamma;
  // Do stuff with the new orientation data

Si para ti ha resultado útil nuestro post, sería de mucha ayuda si lo compartieras con el resto desarrolladores así contrubuyes a dar difusión a esta información.

---

---

Utiliza Nuestro Buscador