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

うーん、愚かな私、私は地理位置情報の呼び出しに最も集中していて、javascriptの問題を見るのを忘れていました。したがって、clearWatch() が応答しなかった理由は、vars startId と trackId が JS の先頭で宣言されていなかったためです。var startId = .... という宣言を呼び出しに入れました。スクリプトを調整したところ、問題ありません。

このスクリプトをプロジェクトの基礎として自由に使用および/または編集してください。

于 2013-01-25T08:17:05.487 に答える