Html5地理位置clearWatch()没有响应 [英] Html5 Geolocation clearWatch() is not responding

查看:176
本文介绍了Html5地理位置clearWatch()没有响应的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我编译并调整此演示脚本,以便学习使用其他脚本的某些地理位置进行跟踪。到目前为止这么好...但clearWatch()停止搜索或跟踪的函数没有响应,因为alert()没有显示出来。

I compile and adjust this demo script for learning tracking with geolocation from parts of other scripts. So far so good... but the functions clearWatch() to stop searching or tracking are not responding because the alert() after it is not showing up.

Something I忘了?

Something I forgot?

<!DOCTYPE html>
<html>
    <head>
        <meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
        <style type="text/css">
            html { height: 100% }
            body { height: 100%; margin: 0px; padding: 0px }
            #map_canvas { height: 100% ; width:100%;}
            </style>
        <script type="text/javascript" src="http://maps.google.com/maps/api/js?sensor=false"></script>
        <script type="text/javascript">

            var previousPosition = null;
            var startId;
            var trackId;

            function initialize() {
                document.getElementById("info").innerHTML = "Je positie aan het zoeken...";

                if (navigator.geolocation) {

                    startId = navigator.geolocation.watchPosition(function(position) {
                        var startPos = position;
                        var startAccuracy = startPos.coords.accuracy;
                        document.getElementById("info").innerHTML = "In de buurt... ca." + startAccuracy + " meter...";
                        if(startAccuracy < 3) {
                            document.getElementById("info").innerHTML = "Gevonden... binnen " + startAccuracy + " meter...";
                            map = new google.maps.Map(document.getElementById("map_canvas"), {
                                zoom: 18,
                                center: new google.maps.LatLng(startPos.coords.latitude, startPos.coords.longitude),
                                mapTypeId: google.maps.MapTypeId.ROADMAP
                                });
                            var marker = new google.maps.Marker({
                                position: new google.maps.LatLng(startPos.coords.latitude, startPos.coords.longitude),
                                map: map
                                });
                            navigator.geolocation.clearWatch(startId);
                            document.getElementById("info").innerHTML = "Tracking start over 5 seconden...";
                            setTimeout(function(){startTracking()},5000);
                        }
                        }, function(error) {
                        alert("Error code: " + error.code);
                        // error.code can be:
                        //   0: unknown error
                        //   1: permission denied
                        //   2: position unavailable (error response from locaton provider)
                        //   3: timed out
                        }, {maximumAge:1000, enableHighAccuracy: true});

                }
                else {
                    alert("GeoLocatie wordt niet ondersteund!");
                }

            }

            function startTracking() {

                document.getElementById("info").innerHTML = "Tracking is gestart...";

                trackId = navigator.geolocation.watchPosition(successCallback, null, {maximumAge:1000, timeout:60000, enableHighAccuracy:true});

                function successCallback(position){
                    map.panTo(new google.maps.LatLng(position.coords.latitude, position.coords.longitude));
                     if (previousPosition){
                        var newLineCoordinates = [
                                                  new google.maps.LatLng(previousPosition.coords.latitude, previousPosition.coords.longitude),
                                                  new google.maps.LatLng(position.coords.latitude, position.coords.longitude)];

                        var newLine = new google.maps.Polyline({
                                                               path: newLineCoordinates,
                                                               strokeColor: "#FF0000",
                                                               strokeOpacity: 1.0,
                                                               strokeWeight: 2
                                                               });
                        newLine.setMap(map);
                    }
                    previousPosition = position;
                };

            }

            function stopZoeken() {
                navigator.geolocation.clearWatch(startId);
                alert("Zoeken gestopt!");
            }

            function stopTracking() {
                navigator.geolocation.clearWatch(trackId);
                alert("Tracking gestopt!");
            }

            </script>
    </head>

    <body onload="initialize()">
        <div id="info"></div>
        <div><input type="button" onclick="stopZoeken()" value="Stop Zoeken" />&nbsp;&nbsp;&nbsp;<input type="button" onclick="stopTracking()" value="Stop Tracking" /></div>
        <div id="map_canvas"></div>
    </body>

</html>


推荐答案

Grrr,愚蠢的我,我最关注的是地理位置电话,忘了看看JavaScript问题。所以,clearWatch()没有响应的原因是:vars startId和trackId没有在JS中被声明。我把声明放在调用中:var startId = ....,所以我调整了脚本,现在就可以了!

Grrr, stupid me, I focus most on the geolocation calls and forgot to look at the javascript issue. So, the reason why clearWatch() was not responding was: the vars startId and trackId were not declared at top in JS. I put the declaration in the call: var startId = ...., so I adjusted the script and it's ok now!

随意使用和/或编辑这个脚本作为您项目的基础。

Feel free to use and/or edit this script as a basis for your project.

这篇关于Html5地理位置clearWatch()没有响应的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆