How can I calculate the heading (N/W/S/E) given (x,y,z) magnetometer and accelerometer data?

Question

I am using react-native-sensor to grab the raw data from these sensors.

import {magnetometer, acclerometer} from 'react-native-sensors';
const subscription = accelerometer.subscribe(({ x, y, z, timestamp }) =>
    console.log({ x, y, z, timestamp })
    this.setState({ accelerometer: { x, y, z, timestamp } })
);
const subscription = magnetometer.subscribe(({ x, y, z, timestamp }) => 
    console.log({ x, y, z })
    this.setState({ magnetometer: { x, y, z, timestamp } })
);

Given these 6 data points, how can I get the degree and direction? What is the appropriate algorithm?

I do not understand the algorithm in this answer. This answer utilizes alpha, beta, gamma...is that the same as "x, y, z"? Why does that only use 3 data points and not 6? Why do some other answers say that accelerometer data is required (for tilt adjustment?). Why isn't there an answer that utilizes all 6 data points?

(note: the documentation has a mis-spelling of "magenetometer")

Answer 1

Background

The magnetometer measures the Earth’s magnetic field. This information is combined with an accelerator inside the phone. The accelerator gets information regarding the phone’s position in space. It is able to pinpoint the phone’s position from solid-state sensors within the phone that can measure their tilt and movement. The information provided by these devices means that the compass app can display cardinal directions no matter which orientation the phone is in, according to the algorithmic software development company Sensor Platforms.

A similar project: compass-react-native-non-expo under MIT License to use device's built in Magnetometer sensor only, to identify direction and calculate degree of angle using the package react-native-sensors, uses 3 data points from magnetometer:

subscribe = async () => {
    new Magnetometer({
      updateInterval: 100
    })
    .then(magnetometerObservable => {
      this._subscription = magnetometerObservable;
      this._subscription.subscribe(sensorData => {
        console.log(sensorData);
        this.setState({magnetometer: this._angle(sensorData)});
      });
    })
    .catch(error => {
      console.log("The sensor is not available");
    });
  };

  _unsubscribe = () => {
    this._subscription && this._subscription.stop();
    this._subscription = null;
  };

  _angle = (magnetometer) => {
    if (magnetometer) {
      let {x, y, z} = magnetometer;

      if (Math.atan2(y, x) >= 0) {
        angle = Math.atan2(y, x) * (180 / Math.PI);
      }
      else {
        angle = (Math.atan2(y, x) + 2 * Math.PI) * (180 / Math.PI);
      }
    }

    return Math.round(angle);
  };

  _direction = (degree) => {
    if (degree >= 22.5 && degree < 67.5) {
      return 'NE';
    }
    else if (degree >= 67.5 && degree < 112.5) {
      return 'E';
    }
    else if (degree >= 112.5 && degree < 157.5) {
      return 'SE';
    }
    else if (degree >= 157.5 && degree < 202.5) {
      return 'S';
    }
    else if (degree >= 202.5 && degree < 247.5) {
      return 'SW';
    }
    else if (degree >= 247.5 && degree < 292.5) {
      return 'W';
    }
    else if (degree >= 292.5 && degree < 337.5) {
      return 'NW';
    }
    else {
      return 'N';
    }
  };

  // Match the device top with pointer 0° degree. (By default 0° starts from the right of the device.)
  _degree = (magnetometer) => {
    return magnetometer - 90 >= 0 ? magnetometer - 90 : magnetometer + 271;
};

Another project: react-native-sensor-manager uses the 6 data points from both magnetometer and accelerometer to calculate the orientation:

 float[] mGravity;
float[] mGeomagnetic;

@Override
public void onSensorChanged(SensorEvent sensorEvent) {
  Sensor mySensor = sensorEvent.sensor;
  WritableMap map = mArguments.createMap();

  if (mySensor.getType() == Sensor.TYPE_ACCELEROMETER)
    mGravity = sensorEvent.values;
  if (mySensor.getType() == Sensor.TYPE_MAGNETIC_FIELD)
    mGeomagnetic = sensorEvent.values;
  if (mGravity != null && mGeomagnetic != null) {
    float R[] = new float[9];
    float I[] = new float[9];
    boolean success = mSensorManager.getRotationMatrix(R, I, mGravity, mGeomagnetic);
    if (success) {
      long curTime = System.currentTimeMillis();
      float orientation[] = new float[3];
      mSensorManager.getOrientation(R, orientation);

      float heading = (float)((Math.toDegrees(orientation[0])) % 360.0f);
      float pitch = (float)((Math.toDegrees(orientation[1])) % 360.0f);
      float roll = (float)((Math.toDegrees(orientation[2])) % 360.0f);

      if (heading < 0) {
        heading = 360 - (0 - heading);
      }

      if (pitch < 0) {
        pitch = 360 - (0 - pitch);
      }

      if (roll < 0) {
        roll = 360 - (0 - roll);
      }

      map.putDouble("azimuth", heading);
      map.putDouble("pitch", pitch);
      map.putDouble("roll", roll);
      sendEvent("Orientation", map);
      lastUpdate = curTime;
    }
  }
}

There are others too.