面对Google Maps API的问题 - 路线服务清除路线

时间:2018-01-05 08:37:27

标签: javascript google-maps google-maps-api-3

如果已经存在用户(A)路径的setDirection,则在Map上,然后如果我设置新用户(B)方向路径,那么我想清除旧用户(A)路径路径。

我遇到一个问题,当我点击用户(B)然后点击用户(B)的方向路径集但用户(A)路径没有清除。

我还设置了空白对象,数组 directionsDisplay.setDirections({routes:[]}); 但它对我不起作用。

你能不能错过任何事情 - 请指导我

以下是我的代码:

var directionsDisplay;
    var directionsService = new google.maps.DirectionsService();
    var map;
    var route = [];
    function initialize() {
        directionsDisplay = new google.maps.DirectionsRenderer();
        var chicago = new google.maps.LatLng(23.023292, 72.571144);
        var mapOptions = {
            zoom: 11,
            center: chicago
        };
        map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
        //console.log(map);
        directionsDisplay.setMap(map);

    }

    $(document).ready(function(){
        google.maps.event.addDomListener(window, 'load', initialize);
    });

    function calcRoute(data) {           

        if(data.length)
        {
            for (var key in data) {
                var track = data[key];
                var start = new google.maps.LatLng(track[0].latitude,track[0].longitude);
                var end = new google.maps.LatLng(track[track.length - 1].latitude,track[track.length - 1].longitude);

                var waypoints = track;
                waypoints.shift();
                waypoints.pop();

                var waypointsgoogle = [];

                for(var waykey in waypoints)
                {
                    waypointsgoogle.push({
                        location: new google.maps.LatLng(waypoints[waykey].latitude,waypoints[waykey].longitude),
                        stopover: false
                    });
                }

                directionsService.route({
                    origin: start,
                    destination: end,
                    optimizeWaypoints:true,
                    travelMode: google.maps.TravelMode.DRIVING,
                    waypoints:waypointsgoogle
                }, function (response, status) {
                if (status == google.maps.DirectionsStatus.OK) {

                    var directionsDisplay = new google.maps.DirectionsRenderer({
                            preserveViewport: true
                        });

                        directionsDisplay.setOptions({
                            polylineOptions: {
                                strokeColor: '#0089d0'                                    
                            }
                        });

                        directionsDisplay.setMap(map);
                        directionsDisplay.setDirections(response);
                } else {
                    alert("Directions Request from " + start.toUrlValue(6) + " to " + end.toUrlValue(6) + " failed: " + status);
                }
                }); 
            }
        }
        else`enter code here`
        {
            directionsDisplay = new google.maps.DirectionsRenderer();
        }
    }

1 个答案:

答案 0 :(得分:0)

第44行:带走" var",你说var directionsDisplay = ...

编辑:您最好删除整行44. directionsDisplay已经是DirectionsRenderer

函数内部的var是每次调用函数时都创建一个新对象。因此,旧对象只会停留在地图上(除非您无法轻松访问它,因为var directionsDisplay不再指向旧对象)。

// global variables, outside of every function
var directionsDisplay;
var directionsService;

// Below this point DO NOT use "var directionsDisplay" or "var directionsService" anymore.
// omit the var

function initialize() {
  directionsDisplay = new google.maps.DirectionsRenderer();
  ...
}
...

我知道这是问题,我不确定它能解决所有问题。如果不是,请告诉我。