在 Expo 项目中，直接使用 Magnetometer 的原始 x/y 数据计算航向（heading）会导致方向偏差和倾斜敏感问题；应改用 Location.watchHeadingAsync() 获取经设备校准、融合加速度计与陀螺仪的真北航向，该方法与系统原生指南针一致。
在 expo 项目中，直接使用 `magnetometer` 的原始 x/y 数据计算航向（heading）会导致方向偏差和倾斜敏感问题；应改用 `location.watchheadingasync()` 获取经设备校准、融合加速度计与陀螺仪的真北航向，该方法与系统原生指南针一致。
开发 React Native 指南针类应用时，一个常见误区是仅依赖磁力计（Magnetometer）原始三轴数据（x, y, z）通过 Math.atan2(y, x) 计算二维平面航向。这种做法看似简洁，实则存在根本性缺陷：磁力计仅提供磁场矢量，而非地理方向。iOS 系统内置指南针 App 能准确指向磁北（或真北，取决于设置），是因为它并非简单读取磁力计，而是通过 传感器融合（Sensor Fusion） —— 即联合使用磁力计、加速度计（Accelerometer）和陀螺仪（Gyroscope）数据，并结合设备姿态（pitch/roll/yaw）、硬铁/软铁校准模型及地磁偏角（declination）补偿，最终解算出稳定、抗倾斜、抗干扰的航向角。
你遇到的现象——箭头随手机倾斜剧烈偏移、在机场等强干扰环境下仍偏离原生指南针——正是纯磁力计方案的典型表现：
已弃用 — 请改用 `auth0` 技能（运行 `npx clawhub install auth0`）。适用于为 React 单页应用（SPA）添加 Auth0 登录、登出、受保护路由或用户会话功能。该技能集成 `@auth0/auth0-react` — 即使用户仅表述为“为我的 React 应用添加登录功能”或“保护我的 React 路由”，而未明确提及 Auth0，也应使用此技能。
- ✅ Math.atan2(data.y, data.x) 仅反映设备 XY 平面内磁场投影方向，未考虑 Z 轴分量及设备朝向；
- ❌ 未进行姿态补偿（如俯仰 pitch 和横滚 roll 校正），导致手机非水平时计算失效；
- ❌ 未应用地磁偏角校正（尤其在高纬度或特定区域），造成磁北与真北偏差；
- ❌ 未做磁场干扰动态校准（如机场金属结构、电子设备产生的杂散场），而系统指南针已内置实时校准逻辑。
✅ 正确解法：使用 Expo 提供的高层抽象 API —— Location.watchHeadingAsync()
该 API 封装了 iOS Core Location 的 CLHeading 服务，底层调用 CLLocationManager.heading，自动完成：
- 多传感器融合（Magnetometer + Accelerometer + Gyro）
- 实时硬件校准（含设备级硬铁补偿）
- 地磁偏角自动查表与修正（基于设备 GPS 位置）
- 姿态自适应（支持任意握持角度，输出始终为水平面内相对于正北的方位角）
✅ 正确代码示例（适配 Expo SDK 49+）
import React, { useEffect, useState } from 'react';
import { View, Text } from 'react-native';
import * as Location from 'expo-location';
const Compass = () => {
const [heading, setHeading] = useState<number | null>(null);
const [isAvailable, setIsAvailable] = useState<boolean>(false);
useEffect(() => {
const startWatching = async () => {
// 检查定位权限（watchHeadingAsync 需要位置权限）
const { status } = await Location.requestForegroundPermissionsAsync();
if (status !== 'granted') {
console.warn('Location permission denied for heading');
return;
}
// 检查 heading 是否可用（部分设备/系统版本可能不支持）
const isHeadingAvailable = await Location.isHeadingAvailable();
setIsAvailable(isHeadingAvailable);
if (!isHeadingAvailable) return;
// 开始监听航向变化（单位：度，范围 0–360，0 = 正北）
const subscription = await Location.watchHeadingAsync(
(headingData) => {
// headingData.trueHeading 是真北方向（需 GPS 定位），magneticHeading 是磁北方向
// 推荐优先使用 trueHeading；若为 null，则回退到 magneticHeading
const angle = headingData.trueHeading ?? headingData.magneticHeading;
if (typeof angle === 'number' && !isNaN(angle)) {
setHeading(angle);
}
}
);
return () => subscription.remove(); // 清理订阅
};
startWatching();
}, []);
return (
<View style={{ flex: 1, justifyContent: 'center', alignItems: 'center' }}>
{isAvailable ? (
<View>
<Text style={{ fontSize: 24, fontWeight: 'bold' }}>
Heading: {heading?.toFixed(1)}°
</Text>
{/* 此处可接入你的 Arrow 组件，注意：angle=0 表示正北，需按顺时针旋转 */}
<Arrow angle={heading?.toString() || '0'} />
</View>
) : (
<Text>Heading not available — check permissions & device support</Text>
)}
</View>
);
};
export default Compass;⚠️ 关键注意事项
- 权限要求：watchHeadingAsync 需要 location 权限（ACCESS_COARSE_LOCATION / NSLocationWhenInUseUsageDescription），请确保在 app.json 或 app.config.js 中配置对应描述字段；
- 真北 vs 磁北：trueHeading 依赖 GPS 定位精度，弱信号下可能为 null；magneticHeading 更稳定但需手动加地磁偏角（可通过 Location.getProviderStatusAsync() 或第三方服务获取）；
- 性能与电池：该 API 持续运行传感器融合，建议在组件卸载时务必调用 subscription.remove()；
- 环境干扰：机场确实存在强磁场干扰（安检门、行李传送带、金属结构），但系统级 watchHeadingAsync 已集成动态校准算法，比裸磁力计鲁棒得多——这正是它“能用”而你手动计算“不能用”的根本原因。
? 总结：在 Expo 生态中，永远优先选用封装完善的高层传感器 API（如 watchHeadingAsync），而非自行处理原始传感器数据。它不仅节省开发时间，更保障了跨设备一致性、准确性与用户体验。磁力计原始数据仅适用于高级场景（如自定义姿态估计、AR 场景锚点），普通指南针需求，请交给系统。
