0

セナリオ:

私はグーグルマップを持っていて、その機能の1つは、中心点から同じマップ上のいくつかの異なる場所へのルーティング情報を表示することです。各方向オブジェクトは一度に1セットのルートしか表示できないことを知っているので、呼び出されるたびにレンダーオブジェクトを作成し、ルートをマップ上に配置して場所ごとに呼び出す関数があります。

コード:

ルートを計算して表示する関数:

  function calculateRoot (startLocation,wayPoints,endLocation) {
            var selectedMode = $("#travelMode").val(); 
            // create a new directions service object to handle directions requests 
            var directionsService = new google.maps.DirectionsService();
            // create a directions display to display route info on the map
            var directionsDisplay = new google.maps.DirectionsRenderer();
            directionsDisplay.setMap(map);
            // Stops the default googlemarkers from showing
            directionsDisplay.suppressMarkers = true;
            directionsDisplay.setPanel(document.getElementById("directions"));

            // create a request object
            var request = {
                origin:startLocation,
                waypoints: wayPoints,
                destination:endLocation,
                travelMode: google.maps.TravelMode[selectedMode],
                optimizeWaypoints:true,
                provideRouteAlternatives:true,
                transitOptions: {
                    departureTime: new Date()
                }
                };   
            directionsService.route(request, function(result,status) {
                if (status == google.maps.DirectionsStatus.OK) {
                    directionsDisplay.setDirections(result);
                    return directionsDisplay;
                }

                else if (status == google.maps.DirectionsStatus.ZERO_RESULTS){
                    alert ('No routing can be found for this Journey');
                    return -1;
                }
                else {
                    alert ('The following error occoured while attempting to obtain directions information:'+'\n'+status + '\n' + 'For:'+ ' '+ request.destination);
                    return -1;
                }
            });
        }

すべての場所が機能します:

      function showAllRoutes(){
            if ( ! directionsArray.length < 1) {
                // if directions are already displayed clear the route info
                clearRoots();
            } 
            $('#directions').empty();
            // craete an empty waypoint array just to pass to the function
            var wayPoints = [];
            for (var i = 0; i< markerArray.length; i++) {
                 var directions = calculateRoot(startLatLng,wayPoints,markerArray[i].position); 
                     directionsArray.push(directions);

            }
            sizeMap();
            $('#directions').show();
        }

ルートをクリアする機能

function clearRoutes() {
            if (directionsArray.length <1 ) {
                alert ("No directions have been set to clear");
                return;

            }
            else {
                $('#directions').hide();
                for (var i = 0;i< directionsArray.length; i ++) {
                  if (directionsArray [i] !== -1) {
                      directionsArray [i].setMap(null); 
                  }
                }
                directionsArray.clear();
                map.setZoom(5);
                return;
            }   
        }

問題:

ルートの生成と表示は問題なく機能しているようですが、更新しない限り、マップからルートをクリアすることはできません。私は何か簡単なことを見逃しているのでしょうか、それともこのように行う必要のないことを行うことができるのでしょうか。私はこれを1日以上機能させようとしていて、困惑しています。誰か助けてもらえますか?前もって感謝します

4

1 に答える 1

0

ルート案内サービスは非同期で、calculateRoot (または calculateRoute または実際に呼び出されたもの) は何も返すことができません。ルートをコールバック関数のグローバル配列にプッシュする必要があります。

これはコールバック関数です:

function(result,status) {
            if (status == google.maps.DirectionsStatus.OK) {
                directionsDisplay.setDirections(result);
                return directionsDisplay;
            }

次のように変更します。

function(result,status) {
            if (status == google.maps.DirectionsStatus.OK) {
                directionsDisplay.setDirections(result);
                directionsArray.push(directionsDisplay);
            }
于 2012-09-11T22:24:24.517 に答える