2015-09-04 224 views
2

我想知道如果有一種方式來獲得API來通知我取一個渡口的時候。我知道你可以改變avoidFerries:true和false之間,但是當設置爲true時,我需要一種瞭解渡輪已被採取的方式,所以如果需要可以通過外部按鈕覆蓋。我只需要一種讓gMaps告訴我一個已被採用的方法。任何建議將不勝感激。谷歌地圖API V3渡輪檢測

問候。

回答

3

你必須分析的路線的步驟。

當一個步驟需要它取決於TravelMode渡輪如何檢測它。

過境你必須檢查:

step.transit.line.vehicle.type==='FERRY' 

其他TravelModes這將是:

/** 
    * @param route object DirectionsRoute 
    * @return array with steps where a ferry has been taken 
    **/ 
    function get_ferries(route){ 
    var f=[],section; 
    for(var leg=0;leg<route.legs.length;++leg){ 
     for(var step=0;step<route.legs[leg].steps.length;++step){ 
      section = route.legs[leg].steps[step]; 
      if(
       section.maneuver==='ferry' 
        || 
       (
        section.transit 
        && 
        section.transit.line 
        && 
        section.transit.line.vehicle 
        && 
        section.transit.line.vehicle.type==='FERRY' 
       ) 
      ){ 
       f.push(section); 
      } 
     } 
    } 
    return f; 
    } 

step.maneuver==='ferry' 

檢測到它可能看起來像這樣的功能演示:

function initMap() { 
 
    var goo  = google.maps, 
 
     service = new goo.DirectionsService, 
 
     map  = new goo.Map(document.getElementById('map'), { 
 
        zoom: 0, 
 
        center: {lat: 0, lng: 0}, 
 
        noClear:true 
 
        }), 
 
     renderer = new goo.DirectionsRenderer({suppressMarkers:true,map:map,polylineOptions:{strokeWeight:3,zIndex:100}}), 
 
     ctrl  = document.getElementById('ctrl'), 
 
     sMode  = ctrl.querySelector('select[name="mode"]'), 
 
     sRoute = ctrl.querySelector('select[name="route"]') 
 
     sFerry = ctrl.querySelector('select[name="ferries"]') 
 
     calcRoute = function(){ 
 
        var mode   = goo.TravelMode[sMode.value], 
 
         avoidFerries = !!parseInt(sFerry.value), 
 
         route   = sRoute.options[sRoute.selectedIndex], 
 
         origin  = route.getAttribute('data-origin'), 
 
         destination = route.getAttribute('data-destination'); 
 
         map.data.forEach(function(f){ 
 
          map.data.remove(f); 
 
         }); 
 
         service.route({ 
 
             origin  : origin, 
 
             destination : destination, 
 
             travelMode : mode, 
 
             avoidFerries: avoidFerries 
 
             }, function(response, status) { 
 
          renderer.setDirections(response); 
 
          if (status !== goo.DirectionsStatus.OK) { 
 
          alert('Directions request failed due to ' + status); 
 
          } 
 
         }); 
 

 
        }; 
 
        
 
     map.data.setStyle({ 
 
     strokeColor: 'tomato', 
 
     strokeWeight: 5, 
 
     strokeOpacity: 1, 
 
     zIndex:1000, 
 
     icon: 'https://maps.gstatic.com/mapfiles/transit/iw2/6/ferry.png' 
 
     }); 
 
     map.controls[google.maps.ControlPosition.TOP_CENTER].push(ctrl); 
 
     goo.event.addDomListener(sMode, 'change', calcRoute); 
 
     goo.event.addDomListener(sRoute, 'change', calcRoute); 
 
     goo.event.addDomListener(sFerry, 'change', calcRoute); 
 
     goo.event.addListener(renderer,'directions_changed',function(){ 
 
     var r= this.getDirections(), 
 
      i= this.getRouteIndex(); 
 
      if(r && r.routes && r.routes[i]){ 
 
      var ferries=get_ferries(r.routes[i]); 
 
      if(ferries.length){ 
 
      
 
       alert('Ferries:'+ ferries.length); 
 
       for(var f=0;f<ferries.length;++f){ 
 
       map.data.add({geometry:ferries[f].start_location}) 
 
       map.data.add({geometry:new goo.Data.LineString(ferries[f].path)}) 
 
       } 
 
       
 
      }   
 
      } 
 
     }); 
 
     function get_ferries(route){ 
 
     var f=[],section; 
 
     for(var leg=0;leg<route.legs.length;++leg){ 
 
      for(var step=0;step<route.legs[leg].steps.length;++step){ 
 
       section = route.legs[leg].steps[step]; 
 
       if(
 
        section.maneuver==='ferry' 
 
         || 
 
        (
 
         section.transit 
 
         && 
 
         section.transit.line 
 
         && 
 
         section.transit.line.vehicle 
 
         && 
 
         section.transit.line.vehicle.type==='FERRY' 
 
        ) 
 
       ){ 
 
        f.push(section); 
 
       } 
 
      } 
 
     } 
 
     return f; 
 
     } 
 
     calcRoute(); 
 
}
html, 
 
body, 
 
#map { 
 
    height: 100%; 
 
    margin: 0; 
 
    padding: 0; 
 
}
<div id="map"> 
 
     <div id="ctrl"> 
 
     <select name="route"> 
 
      <option data-origin="Rostock,DE" data-destination="Bornholm,DK">Rostock-Bornholm</option> 
 
      <option data-origin="Rotterdam,NL" data-destination="Ipswich,UK">Rotterdam-Ipswich</option> 
 
      <option data-origin="Manhattan,US" data-destination="Ellis Island,US">Manhattan-Ellis Island</option> 
 
     </select> 
 
     <select name="mode"> 
 
      <option value="DRIVING">Driving</option> 
 
      <option value="TRANSIT">Transit</option> 
 
      <option value="WALKING">Walking</option> 
 
      <option value="BICYCLING">Bicycling</option> 
 
     </select> 
 
     <select name="ferries"> 
 
      <option value="0">avoidFerries:no</option> 
 
      <option value="1">avoidFerries:yes</option> 
 
     </select> 
 
     </div> 
 
    </div> 
 
    <script src="https://maps.googleapis.com/maps/api/js?v=3&callback=initMap" async defer></script>

+0

非常感謝你這個完美工作。 –