如何在音位间隙中显示纬度、经度、航向

问题描述 投票:0回答:3

我想使用phonegap在同一个应用程序中显示纬度,经度,航向。我尝试了phonegap相同的程序。如果我得到纬度,经度,我无法得到航向为空。有什么办法吗?

<!DOCTYPE html>
<html>
  <head>
    <title>Compass Example</title>

    <script type="text/javascript" charset="utf-8" src="phonegap-1.3.0.js"></script>
    <script type="text/javascript" src="jquery.js"></script>
    <link rel="stylesheet" href="css/compass.css"/>

    <script type="text/javascript" charset="utf-8">
       // The watch id references the current `watchHeading`
    var watchID = null;


    // Wait for PhoneGap to load
    //
    document.addEventListener("deviceready", onDeviceReady, false);

    // PhoneGap is ready
    //
    function onDeviceReady() {
        var options = { frequency: 500 };
        watchID = navigator.compass.watchHeading(onSuccess, onError, options);
        //watchID = navigator.geolocation.watchPosition(onSuccess, onError, options);


    }

/*
    // Start watching the compass
    //
    function startWatch() {
         // Update compass every 3 seconds
        var options = { frequency: 500 };

        watchID = navigator.compass.watchHeading(onSuccess, onError, options);
    }

    // Stop watching the compass
    //
    function stopWatch() {
        if (watchID) {
            navigator.compass.clearWatch(watchID);
            watchID = null;
        }
    }
*/
    // onSuccess: Get the current heading
    //
    function onSuccess(position) {
        var element = document.getElementById('ang');
        var deg_heading = document.getElementById('heading');
        //var lat = position.coords.latitude; 
        //var lng = position.coords.longitude;
        var deg = position.magneticHeading;
        var actual_deg = 360;
        //var deg = '180';
        //alert ("lat/lng: "+lat+","+lng);
        deg_heading.innerHTML = 'Heading: ' + (actual_deg - deg)  + '&#176';// + " lat:"+lat+" long:"+lng;

        element.style.webkitTransform = "rotate(-"+ deg +"deg)";


    }

    // onError: Failed to get the heading
    //
    function onError(compassError) {
        alert('Compass error: ' + compassError.code);
    }

    </script>
  </head>
   <body>
   <!-- <button onclick="startWatch();">Start Watching</button>
    <button onclick="stopWatch();">Stop Watching</button> -->
    <div id="compass" class="comapss">
        <div class="compass_direction"><img id="ang" src="img/direction.png"/></div>
    </div>
    <div id="heading"></div>    
  </body> 
</html>
jquery android cordova
3个回答
0
投票

无论出于何种原因,我必须在某些项目中监视 navigator.compass 的初始化。有时,直到 deviceReady 触发后不久它才会存在。我通常使用这样的东西:

var intervalId = setInterval(function() {
   if( navigator.compass ) {
      clearInterval(intervalId);
      intervalId = navigator.compass.watchHeading(onSuccess, onError, options);
   }
}, 250);

0
投票
function locationFinder() {
    if (navigator.geolocation) {
        function success(pos) {
            current_lng = pos.coords.longitude;
            current_lat = pos.coords.latitude;
            console.log("longitude get" + current_lng);
            console.log("latitude get" + current_lat);
        }
        function fail(error) {
            console.log("error 2");
        }
        // Find the users current position. Cache the location for 5 minutes,
        // timeout after 6 seconds
        navigator.geolocation.getCurrentPosition(success, fail, {
            maximumAge : 500000,
            enableHighAccuracy : true,
            timeout : 6000
        });
    } else {
        window.plugins.toast.showLongBottom("Please check GPS Setting",
                function(a) {
                    console.log('toast success: ' + a)
                }, function(b) {
                    console.log('toast error: ' + b)
                });
    }
}

0
投票

我把这个留在这里是因为我浪费了一整天的时间来解决同样的问题。 您正在寻找错误的 API 来获取手机的方向。地理位置中的航向属性不是指南针方向,而是根据手机的移动计算出的方向。所以如果你站着不动,标题就是空的。一旦您移动,航向就会指向您的移动方向。请参阅此文档:https://developer.mozilla.org/en-US/docs/Web/API/GeolocationCooperatives/heading

您正在寻找的是“deviceorientation”事件。对于 iOS/Safari,您必须首先手动请求该功能。 (这是 Typescript 代码)

const isIOS = !(
    navigator.userAgent.match(/(iPod|iPhone|iPad)/) &&
    navigator.userAgent.match(/AppleWebKit/)
);
if (isIOS) {
    (DeviceOrientationEvent as any).requestPermission()
        .then((response: any) => {
            if (response === "granted") {
                window.addEventListener("deviceorientation", this.receivedNewHeading, true);
            } else {
                alert("has to be allowed!");
            }
        })
        .catch(() => alert("not supported"));
} else {
    window.addEventListener("deviceorientationabsolute", this.receivedNewHeading, true);
}

© www.soinside.com 2019 - 2024. All rights reserved.