2

我编译并调整了这个演示脚本，用于学习使用来自其他脚本部分的地理位置进行跟踪。到目前为止一切都很好......但是停止搜索或跟踪的功能 clearWatch() 没有响应，因为它之后的 alert() 没有出现。

我忘记了什么？

<!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>
4

1 回答 1

2

Grrr，愚蠢的我，我最关注地理定位调用而忘记查看 javascript 问题。所以， clearWatch() 没有响应的原因是：变量 startId 和 trackId 没有在 JS 的顶部声明。我将声明放在调用中：var startId = ....，所以我调整了脚本，现在可以了！

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

于 2013-01-25T08:17:05.487 回答