Google Maps API如何在路线上添加当前的流量条件

时间:2015-04-09 20:58:39

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

任何帮助都会非常感谢你。

我有显示主要路线和替代路线的代码,但是我试图显示路线的交通状况,例如:

如果你去地图和方向 它们会在您的路线上显示红线或黄线。这取决于交通状况。有没有办法在地图上显示交通状况?

我知道他们的交通状况服务,但它显示了该地区的交通。我只需要路线上的交通。

我的代码

var lontLatObejct = sharedProperties.getString();           
        var myOptions = {
            zoom: 10,
            center: new google.maps.LatLng(lontLatObejct.strLocLatitude, lontLatObejct.strLocLongitude),
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            mapTypeControl: false
        };
        var mapObject = new google.maps.Map(document.getElementById("divMap"), myOptions);

        var mapCanvas = document.getElementById('divMap');
        var start = document.getElementById('txtStartingAddress').value.toString();
        var end = document.getElementById('txtEndingAddress').value.toString();
        var request = {
            origin: start,
            destination: end,
            provideRouteAlternatives: true,
            travelMode: google.maps.DirectionsTravelMode.DRIVING,
            unitSystem: google.maps.UnitSystem.METRIC
        };


        directionsDisplay.setMap(mapObject);
        directionsDisplay.setPanel(document.getElementById("divDirectionsPanel"));

        directionsService.route(
            request,
            function (response, status) {
                if (status == google.maps.DirectionsStatus.OK) {
                    for (var i = 0, len = response.routes.length; i < len; i++) {                       
                        switch(i){
                            case 0:
                                new google.maps.DirectionsRenderer({
                                    map: mapObject,
                                    directions: response,
                                    routeIndex: i,
                                    draggable: true
                                });
                                break;                              
                            default:
                                new google.maps.DirectionsRenderer({
                                    map: mapObject,
                                    directions: response,
                                    routeIndex: i,
                                    draggable: true,
                                    polylineOptions: { strokeColor: '#666666', strokeWeight: 6, strokeOpacity: .7 },
                                    suppressMarkers: true,                              
                                });
                        }                       
                    }
                    directionsDisplay.setDirections(response);

                } else {

                }
            }
        );

1 个答案:

答案 0 :(得分:1)

您唯一的选择是google.maps.TrafficLayer

var trafficLayer;

...

if (!trafficLayer || !trafficLayer.setMap) 
  trafficLayer = new google.maps.TrafficLayer();

if (status == google.maps.DirectionsStatus.OK) {
  trafficLayer.setMap(mapObject);
...
} else {
  trafficLayer.setMap(null);
}