使用phoneGap 的 HTML 5 地理定位

发布于 2024-12-07 09:14:39 字数 3866 浏览 0 评论 0原文

我创建了一个脚本，将使用地理位置库显示用户的位置，一切正常。我已使用 PhoneGap 导出此 HTML 5 脚本，并且可以看到在“设置”->“位置服务”中“我的应用程序”设置为“打开”。因此，我假设每次运行“我的应用程序”时，我都不会收到常规提示“...想使用您当前的位置吗？”使用“不允许”或“确定”选项。

我不希望人们每次打开“我的应用程序”时都单击“允许”。应用程序不使用“服务”->“位置设置”中的设置是否有原因？下面是简单的脚本：

<!DOCTYPE html>
<html>
    <head>
        <meta name="apple-mobile-web-app-capable" content="yes" />

        <meta name="apple-mobile-web-app-status-bar-style" content="black" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

        <link rel="apple-touch-icon-precomposed" href="custom_icon_precomposed.png"/>
        <link rel="apple-touch-startup-image" href="apple-touch-icon-precomposed.png">
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
            <script>

                jQuery(window).ready(function(){
                                     jQuery("#btnInit").click(initiate_watchlocation);
                                     jQuery("#btnStop").click(stop_watchlocation);
                                     });

                var watchProcess = null;

                function initiate_watchlocation() {  
                    if (watchProcess == null) {  
                        watchProcess = navigator.geolocation.watchPosition(handle_geolocation_query, handle_errors, {enableHighAccuracy:true});  
                    }  
                }  

                function stop_watchlocation() {  
                    if (watchProcess != null)  
                    {  
                        navigator.geolocation.clearWatch(watchProcess);  
                        watchProcess = null;  
                    }  
                }  

                function handle_errors(error)
                {
                    switch(error.code)
                    {
                        case error.PERMISSION_DENIED: alert("user did not share geolocation data");
                        break;

                        case error.POSITION_UNAVAILABLE: alert("could not detect current position");
                        break;

                        case error.TIMEOUT: alert("retrieving position timedout");
                        break;

                        default: alert("unknown error");
                        break;
                    }
                }

                function handle_geolocation_query(position) {  
                    var text = "Latitude: "  + position.coords.latitude  + "<br/>" +  
                    "Longitude: " + position.coords.longitude + "<br/>" +  
                    "Accuracy: "  + position.coords.accuracy  + "m<br/>" +  
                    "Time: " + new Date(position.timestamp);  
                    jQuery("#info").html(text);  

                    var image_url = "http://maps.google.com/maps/api/staticmap?sensor=false&center=" + position.coords.latitude + ',' + position.coords.longitude +  
                    "&zoom=14&size=300x400&markers=color:blue|label:S|" + position.coords.latitude + ',' + position.coords.longitude;  

                    jQuery("#map").remove();  
                    jQuery(document.body).append(  
                                                 jQuery(document.createElement("img")).attr("src", image_url).attr('id','map')  
                                                 );  
                }  
                </script>
            </head>
    <body>
        <div>
            <button id="btnInit" >Monitor my location</button>

            <button id="btnStop" >Stop monitoring</button>
        </div>
        <div id="info"></div>
    </body>
</html>

原文

I have created a script that will show the user's location using the geolocation library and it all works fine. I have exported this HTML 5 script using PhoneGap and can see that in Settings->Location Services My App is set to On. So I assumed every time I run My App I would not get the regular prompt ".... Would like to use your current location?" with the options Don't Allow or Ok.

I don't want to have people click Allow each time they open My App. Is there a reason why the app is not using the setting from Services->Location Settings? Below is the simple script:

<!DOCTYPE html>
<html>
    <head>
        <meta name="apple-mobile-web-app-capable" content="yes" />

        <meta name="apple-mobile-web-app-status-bar-style" content="black" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

        <link rel="apple-touch-icon-precomposed" href="custom_icon_precomposed.png"/>
        <link rel="apple-touch-startup-image" href="apple-touch-icon-precomposed.png">
            <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js" type="text/javascript"></script>
            <script>

                jQuery(window).ready(function(){
                                     jQuery("#btnInit").click(initiate_watchlocation);
                                     jQuery("#btnStop").click(stop_watchlocation);
                                     });

                var watchProcess = null;

                function initiate_watchlocation() {  
                    if (watchProcess == null) {  
                        watchProcess = navigator.geolocation.watchPosition(handle_geolocation_query, handle_errors, {enableHighAccuracy:true});  
                    }  
                }  

                function stop_watchlocation() {  
                    if (watchProcess != null)  
                    {  
                        navigator.geolocation.clearWatch(watchProcess);  
                        watchProcess = null;  
                    }  
                }  

                function handle_errors(error)
                {
                    switch(error.code)
                    {
                        case error.PERMISSION_DENIED: alert("user did not share geolocation data");
                        break;

                        case error.POSITION_UNAVAILABLE: alert("could not detect current position");
                        break;

                        case error.TIMEOUT: alert("retrieving position timedout");
                        break;

                        default: alert("unknown error");
                        break;
                    }
                }

                function handle_geolocation_query(position) {  
                    var text = "Latitude: "  + position.coords.latitude  + "<br/>" +  
                    "Longitude: " + position.coords.longitude + "<br/>" +  
                    "Accuracy: "  + position.coords.accuracy  + "m<br/>" +  
                    "Time: " + new Date(position.timestamp);  
                    jQuery("#info").html(text);  

                    var image_url = "http://maps.google.com/maps/api/staticmap?sensor=false¢er=" + position.coords.latitude + ',' + position.coords.longitude +  
                    "&zoom=14&size=300x400&markers=color:blue|label:S|" + position.coords.latitude + ',' + position.coords.longitude;  

                    jQuery("#map").remove();  
                    jQuery(document.body).append(  
                                                 jQuery(document.createElement("img")).attr("src", image_url).attr('id','map')  
                                                 );  
                }  
                </script>
            </head>
    <body>
        <div>
            <button id="btnInit" >Monitor my location</button>

            <button id="btnStop" >Stop monitoring</button>
        </div>
        <div id="info"></div>
    </body>
</html>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

好菇凉咱不稀罕他 2024-12-14 09:14:39

好的，我仔细查看了一下，发现您必须等待设备准备好，然后在其中调用 window.ready jquery 才能利用本机功能。我以为我会以菜鸟的身份发布这篇文章，但找到我正在寻找的答案是很困难的。

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

        // PhoneGap is ready
        //
        function onDeviceReady() {
            jQuery(window).ready(function(){
                jQuery("#btnInit").click(initiate_watchlocation);
                jQuery("#btnStop").click(stop_watchlocation);
            });

        }

OK I looked all over and found it you must wait for the device to be ready then call your window.ready jquery inside that to utilize native functions. Thought I would post this as a noob it was tuff to find the answer I was looking for.

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

        // PhoneGap is ready
        //
        function onDeviceReady() {
            jQuery(window).ready(function(){
                jQuery("#btnInit").click(initiate_watchlocation);
                jQuery("#btnStop").click(stop_watchlocation);
            });

        }

回复收藏 0 原文

~没有更多了~