指南針用于顯示相對于地理北基點的方向。

步驟1 - 安裝設備定向插件

打開命令提示符窗口并運行以下命令。

C:\Users\username\Desktop\CordovaProject>cordova plugin add cordova-plugin-device-orientation

步驟2 - 添加按鈕

如果你按照我們的最后一個教程，你可能會注意到這個插件類似于加速插件。在本教程中，我們將遵循相同的概念。讓我們在 index.html 中創(chuàng)建兩個按鈕。

<button id = "getOrientation">GET ORIENTATION</button>
<button id = "watchOrientation">WATCH ORIENTATION</button>

步驟3 - 添加事件監(jiān)聽器

現(xiàn)在我們將在 index.js 中的 onDeviceReady 函數(shù)中添加事件監(jiān)聽器。

document.getElementById("getOrientation").addEventListener("click", getOrientation);
document.getElementById("watchOrientation").addEventListener("click", watchOrientation);

步驟4 - 創(chuàng)建函數(shù)

我們將創(chuàng)建兩個函數(shù)，一個獲取當前加速度，另一個查看方向更改。您可以看到我們正在使用頻率選項，因為我們想要每隔三秒觀察一次更改。

function getOrientation(){
   navigator.compass.getCurrentHeading(compassSuccess, compassError);

   function compassSuccess(heading) {
      alert('Heading: ' + heading.magneticHeading);
   };

   function compassError(error) {
      alert('CompassError: ' + error.code);
   };
	
}

function watchOrientation(){
    
   var compassOptions = {
      frequency: 3000
   }

   var watchID = navigator.compass.watchHeading(compassSuccess, compassError, compassOptions);

   function compassSuccess(heading) {
      alert('Heading: ' + heading.magneticHeading);
      setTimeout(function() {
         navigator.compass.clearWatch(watchID);
      }, 10000);

   };

   function compassError(error) {
      alert('CompassError: ' + error.code);
   };
	
}

由于指南針插件幾乎與加速插件相同，我們將在此時顯示錯誤代碼。 某些設備沒有磁羅盤工作所需的磁性傳感器。 如果您的設備沒有它，您會得到以下錯誤。