Question

我正在尝试使用复选框显示/隐藏多个路线，但在设置时无法隐藏或清除路线。我尝试了几件我在网上找到但没有任何成功的东西。

在checbox==false内部，我尝试了

directionsRenderer.setMap(null);
directionsRenderer.setMap(null); directionsRenderer=null; directionsRenderer.setMap(map);
使用directionsRenderer.setMap(null);
directionsDisplay.setMap(map);

和许多其他变化。 ......有什么帮助吗？

代码：

var directionsService = new google.maps.DirectionsService;
function getvoznje() {    
    if  (document.getElementById('voznje').checked==true) 
    { 
        function renderDirections(result) {
            var directionsRenderer = new google.maps.DirectionsRenderer;
            directionsRenderer.setOptions({
                preserveViewport: true,
                draggable: true,
                polylineOptions: {
                    strokeColor: "#00" + (Math.round(Math.random() * 0XFFFF)).toString(16)
                }
            });
            directionsRenderer.setMap(map);
            directionsRenderer.setDirections(result);
        }

        function requestDirections(start1, end1, start2, end2) {
            directionsService.route({
                origin: new google.maps.LatLng(start1,end1),
                destination: new google.maps.LatLng(start2,end2),
                travelMode: google.maps.DirectionsTravelMode.DRIVING
            }, function(result) {
                renderDirections(result);
            });
        }

        for (var i = 0;  i <put.length-3; i+=4){
            requestDirections(put[i], put[i+1], put[i+2], put[i+3]);
        } 

     } 

     if  (document.getElementById('voznje').checked==false)  
     {
         directionsRenderer.setMap(null);
     }
 }

Answer 1

我重新组织代码，因此不会在if语句中创建函数。我希望这是一个可变范围的问题。

将null传递给setMap函数以从地图中移除路线according to the documentation：

是正确的。

此方法指定将在哪些方向上呈现的地图。传递null以从地图中删除路线。

var directionsService = new google.maps.DirectionsService,
    directionsRenderer = new google.maps.DirectionsRenderer;
function renderDirections(result) {
    directionsRenderer.setOptions({
        preserveViewport: true,
        draggable: true,
        polylineOptions: {
            strokeColor: "#00" + (Math.round(Math.random() * 0XFFFF)).toString(16)
        }
    });
    directionsRenderer.setMap(map);
    directionsRenderer.setDirections(result);
}
function requestDirections(start1, end1, start2, end2) {
    directionsService.route({
        origin: new google.maps.LatLng(start1,end1),
        destination: new google.maps.LatLng(start2,end2),
        travelMode: google.maps.DirectionsTravelMode.DRIVING
    }, function(result) {
        renderDirections(result);
    });
}
function getvoznje() {    
    if  (document.getElementById('voznje').checked==true) 
    { 
        for (var i = 0;  i <put.length-3; i+=4){
            requestDirections(put[i], put[i+1], put[i+2], put[i+3]);
        } 
    } 

    if  (document.getElementById('voznje').checked==false)  
    {
        directionsRenderer.setMap(null);
    }
}

Answer 2

工作的代码如下。

    var directionsService = new google.maps.DirectionsService;          
     var directionsRenderer=[];
     var cur=0; 

    function renderDirections(result) {
       directionsRenderer[cur] = new google.maps.DirectionsRenderer;
      directionsRenderer[cur].setOptions({ 
        preserveViewport: true, 
        draggable: true, 
        polylineOptions: {
            strokeColor: "#00" + (Math.round(Math.random() * 0XFFFF)).toString(16) , strokeOpacity:0.6
            } });
      directionsRenderer[cur].setMap(map);
      directionsRenderer[cur].setDirections(result);
      cur=cur+1;
    }

    function requestDirections(start1, end1, start2, end2) {
      directionsService.route({
        origin: new google.maps.LatLng(start1,end1),
        destination: new google.maps.LatLng(start2,end2),
        travelMode: google.maps.DirectionsTravelMode.DRIVING
      }, function(result) {
        renderDirections(result);
      });
    }

    function getvoznjice() {
    for (var i = 0;  i <put.length-3; i+=4){
        requestDirections(put[i],put[i+1],put[i+2],put[i+3]);
       }
    }

function getvoznje() {    
    if  (document.getElementById('voznje').checked==true)  {
        cur=0;
        getvoznjice();
       } 
    if  (document.getElementById('voznje').checked==false) {
        for (var i = 0;  i <cur; i++){
        directionsRenderer[i].setMap(null); 
        }
       } 


}

明确谷歌地图上的方向

2 个答案: