google-maps - 隐藏/显示谷歌地图方向服务

Question

我使用谷歌地图方向服务在地图上显示巴士路线。因为许多路线重叠，我希望能够通过单击复选框来隐藏和显示。

我真的不确定它们是否可以像那样打开/关闭。

function fiveCLine(source,destination,waypoints){
        // show route between the points
        directionsService = new google.maps.DirectionsService();
        directionsDisplay = new google.maps.DirectionsRenderer(
        {
            suppressMarkers: false,
            suppressInfoWindows: true,
            polylineOptions: { strokeColor: '#0093f0', strokeOpacity: 1 },
            preserveViewport: true,
            markerOptions : {icon: 'bus5c.png'}
        });
        directionsDisplay.setMap(map);
        var request = {
            origin:source, 
            destination:destination,
            waypoints:waypoints,
            travelMode: google.maps.DirectionsTravelMode.DRIVING
        };
        directionsService.route(request, function(response, status) 
        {
            if (status == google.maps.DirectionsStatus.OK) 
            {
                directionsDisplay.setDirections(response);

            }
        });
}

Answer 1

这可以使用类setMap()的方法来完成google.maps.DirectionsRenderer。来自 google docs：此方法指定将在其上呈现方向的地图。通过null从地图中删除方向。

例如，我使用按钮来切换路径：

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

  var hideShowBtn = document.getElementById('togglePath');
  google.maps.event.addDomListener(hideShowBtn, 'click', hideShowPath);
}

function hideShowPath() {
    if (directionsDisplay.getMap()) {
        directionsDisplay.setMap(null);
    } else {
        directionsDisplay.setMap(map);
    }
}