2013-05-08 11 views
0

Я использовал следующий код от tutsplus и адаптировал его для использования опции транзита, за исключением того, что он не работает без опции времени отправления, и я не могу заставить его работать.Map from google api

http://wp.tutsplus.com/tutorials/creative-coding/give-your-customers-driving-directions-with-the-google-maps-api/

Я перепробовал все возможные способы, чтобы добавить departureTime/ArrivalTime (DEPARTURE_TIME и arrival_time, но я просто не могу заставить его работать! Пожалуйста, помогите мне !!!

И это действительно не имеет помочь мне в любом случае: https://developers.google.com/maps/documentation/javascript/directions?hl=fr

бы действительно оценить это

var WPmap = { 

    // HTML Elements we'll use later! 
    mapContainer : document.getElementById('map-container'), 
    dirContainer : document.getElementById('dir-container'), 
    toInput  : document.getElementById('map-config-address'), 
    fromInput  : document.getElementById('from-input'), 
    unitInput  : document.getElementById('unit-input'), 
    travelMode  : document.getElementById('travel-mode'),  
    startLatLng : null, 

    // Google Maps API Objects 
    dirService  : new google.maps.DirectionsService(), 
    dirRenderer : new google.maps.DirectionsRenderer(), 
    map:null, 

    showDirections:function (dirResult, dirStatus) { 
     if (dirStatus != google.maps.DirectionsStatus.OK) { 
      switch (dirStatus){ 
       case "ZERO_RESULTS" : alert ('Sorry, we can\'t provide directions to that address. Please try again.') 
        break; 
       case "NOT_FOUND" : alert('Sorry we didn\'t understand the address you entered - Please try again.'); 
        break; 
       default : alert('Sorry, there was a problem generating the directions. Please try again.') 
      } 
      return; 
     } 
     // Show directions 
     WPmap.dirRenderer.setMap(WPmap.map); 
     WPmap.dirRenderer.setPanel(WPmap.dirContainer); 
     WPmap.dirRenderer.setDirections(dirResult); 
    }, 

    getStartLatLng:function() { 
     var n = WPmap.toInput.value.split(","); 
     WPmap.startLatLng = new google.maps.LatLng(n[0], n[1]); 
    }, 

    getSelectedUnitSystem:function() { 
     return WPmap.unitInput.options[WPmap.unitInput.selectedIndex].value == 'metric' ? 
      google.maps.DirectionsUnitSystem.METRIC : 
      google.maps.DirectionsUnitSystem.IMPERIAL; 
    }, 

    getSelectedTravelMode:function() { 
     return WPmap.travelMode.options[WPmap.travelMode.selectedIndex].value == 'driving' ? 
      google.maps.DirectionsTravelMode.DRIVING : 
      google.maps.DirectionsTravelMode.WALKING; 
      google.maps.DirectionsTravelMode.TRANSIT;  
    }, 

    getDirections:function() { 

     var fromStr = WPmap.fromInput.value; //Get the postcode that was entered 

     var dirRequest = { 
      origin  : fromStr, 
      destination : WPmap.startLatLng, 
      travelMode : WPmap.getSelectedTravelMode(), 
      unitSystem : WPmap.getSelectedUnitSystem() 
     }; 

     WPmap.dirService.route(dirRequest, WPmap.showDirections); 
    }, 

    init:function() { 

     //get the content 
     var infoWindowContent = WPmap.mapContainer.getAttribute('data-map-infowindow'); 
     var initialZoom  = WPmap.mapContainer.getAttribute('data-map-zoom'); 

     WPmap.getStartLatLng(); 

     //setup the map. 
     WPmap.map = new google.maps.Map(WPmap.mapContainer, { 
      scrollwheel: false, 
      zoom:parseInt(initialZoom),  //ensure it comes through as an Integer 
      center:WPmap.startLatLng, 
      mapTypeId:google.maps.MapTypeId.HYBRID 
     }); 

     //setup the red pin marker 
     marker = new google.maps.Marker({ 
      map:WPmap.map, 
      position:WPmap.startLatLng, 
      draggable:false 
     }); 


     //set the infowindow content 
     infoWindow = new google.maps.InfoWindow({ 
      content:infoWindowContent 
     }); 
     infoWindow.open(WPmap.map, marker); 

     //listen for when Directions are requested 
     google.maps.event.addListener(WPmap.dirRenderer, 'directions_changed', function() { 

      infoWindow.close();   //close the first infoWindow 
      marker.setVisible(false); //remove the first marker 

      //setup strings to be used. 
      var distanceString = WPmap.dirRenderer.directions.routes[0].legs[0].distance.text; 

      //set the content of the infoWindow before we open it again. 
      infoWindow.setContent('Thanks!<br /> It looks like you\'re about <strong> ' + distanceString + '</strong> away from us. <br />Directions are just below the map'); 

      //re-open the infoWindow 
      infoWindow.open(WPmap.map, marker); 
      setTimeout(function() { 
       infoWindow.close() 
      }, 8000); //close it after 8 seconds. 

     }); 
    }//init 
}; 

google.maps.event.addDomListener(window, 'load', WPmap.init); 

ответ

0

Ressource что действительно никоим образом не помогает вам содержит всю необходимую информацию.

Внутри getDirections() Вы должны добавить transitOptions -объект к dirRequest, который должен содержать либо arrivalTime -или departureTime -свойством. Ожидаемое значение для обоих объектов является Date-object

Пример для вылета в 8:00 утра в следующую пятницу:

var dirRequest = { 
     origin  : fromStr, 
     destination : WPmap.startLatLng, 
     travelMode : WPmap.getSelectedTravelMode(), 
     unitSystem : WPmap.getSelectedUnitSystem(), 
     transitOptions:{ 
         departureTime: new Date(2013, 4, 10, 8, 0, 0) 
         } 
    }; 

Пример для вылета в 4:00 вечера в следующую субботу:

var dirRequest = { 
     origin  : fromStr, 
     destination : WPmap.startLatLng, 
     travelMode : WPmap.getSelectedTravelMode(), 
     unitSystem : WPmap.getSelectedUnitSystem(), 
     transitOptions:{ 
         arrivalTime: new Date(2013, 4, 11, 16, 0, 0) 
         } 
    };