科爾多瓦 - 裝置方向



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

步驟 1 - 安裝裝置方向外掛

開啟命令提示符視窗並執行以下命令。

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

步驟 2 - 新增按鈕

此外掛類似於加速外掛。現在讓我們在 index.html 中建立兩個按鈕。

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

步驟 3 - 新增事件偵聽器

現在,我們將事件偵聽器新增到 index.js 中的 onDeviceReady 函式內部。

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

步驟 4 - 建立函式

我們將建立兩個函式;第一個函式將生成當前加速度,另一個函式將檢查方向變化。你可以看到,我們再次使用 frequency 選項來監視每三秒發生的更改。

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);
   };
}

由於指南針外掛幾乎與加速外掛相同,因此我們這次將向你展示錯誤程式碼。某些裝置沒有指南針工作所需的磁性感測器。如果你的裝置沒有它,將顯示以下錯誤。

Cordova Compass Error
廣告