使用 Javascript 从 Web 应用程序访问设备指南针

Posted 2023-04-14

【中文标题】使用 Javascript 从 Web 应用程序访问设备指南针

【英文标题】：Access device compass from web app with Javascript

【发布时间】：2011-08-20 14:40:16

【问题描述】：

是否可以通过网络应用在 iphone/android 设备上使用 javascript 访问指南针？我已经在网上找了几个小时了，我知道你可以通过

访问加速度计

window.ondevicemotion = 函数（事件）

有谁知道您是否可以从指南针获取信息？？

【问题讨论】：

自从this question 被问到之后，事情可能已经发生了变化，所以我不打算投票结束，但它是另一个相同的问题。

你看到了……但是随着 4.2 的发布，更多的功能可以访问，也就是加速度计和陀螺仪。 peterfriese.de/…

我读过那篇文章，让我想知道指南针功能现在是否也可用......会很酷！

【参考方案1】：

在 iPhone 上，您可以像这样获取指南针值。

window.addEventListener('deviceorientation', function(e) 
    console.log(e.webkitCompassHeading);
, false);

希望对您有所帮助。

【讨论】：

Android 有对应的吗？我写了一个适用于 ios（Safari 和 Chrome）但不适用于 Android 的页面。

我猜有，可惜我不知道。

【参考方案2】：

它现在看起来是跨平台的，请通过Ruadhán O'Donoghue查看excellent article。

对于 Android，它仍然使用window.addEventListener('deviceorientation', ...)，但检查其他事件属性（event.alpha 是指南针方向；beta 和 gamma 也可用，表示倾斜）。

如果链接不可用，以下是相关部分（已改编）：

   if(window.DeviceOrientationEvent) 
      window.addEventListener('deviceorientation', function(event) 
        var alpha;
        // Check for iOS property
        if(event.webkitCompassHeading) 
          alpha = event.webkitCompassHeading;
        
        // non iOS
        else 
          alpha = event.alpha;
          if(!window.chrome) 
            // Assume Android stock
            alpha = alpha-270;
          
        
      
    

CodePen 上提供了另一个用法示例。