Make compass in React-Native

The numbers are just relative to currently detected "magnetic north" which is affected by any material with iron (like steel) in the building. So you first have to determine what the true north is.

Also you need to use the X, Y, and Z and get the direction relative to the phone (if it's held horizontally or vertically and which way portrait or landscape). The algorithm is not simple at all.

For this reason, I suggest you use existing packages for getting the direction instead of the Sensor data package. They do the calculations and give you a number with the heading like you seem to be expecting in your animation code. Another possibility is to look into the open source code of these packages and copy the calculations.

If your React Native app is with Expo, like if it was made with the Create React Native App command (CRNA) then you can use Expo Location. Here's [an example](https://github.com/martincarrera/expo-location-example on Github) and here are the docs (look for the Heading section).

Otherwise, you can use the React Native simple compass