web-dev-qa-db-fra.com

Utilisation de l'API Google Maps pour obtenir des données sur le temps de trajet

Tous les exemples que j'ai rencontrés en utilisant l'API Google Maps semblent montrer une carte quelconque. Je voudrais intégrer les données sur le temps de trajet estimé en voiture qu'ils vous donnent lorsque vous demandez une description de route de A à B dans un site. Et seulement ces données. Est-ce possible sans charger une carte pour le visiteur final?

apigoogle-mapstravel-time
33
Felix Andersen

Oui, c'est certainement possible en utilisant l'API. Vous pouvez construire un objet GDirections sans div de carte ou de directions. Vous pouvez effectuer une demande de chargement de A à B, puis appeler la méthode getDuration pour obtenir le temps de trajet total.

Vous devez d'abord créer un objet directions:

// no need to pass map or results div since
// we are only interested in travel time.
var directions = new GDirections ();

Ensuite, faites votre demande de chargement pour résoudre les directions (j'ai utilisé deux latitudes et longitudes comme points de départ et d'arrivée, mais vous pouvez également utiliser des adresses ici):

var wp = new Array ();
wp[0] = new GLatLng(32.742149,119.337218);
wp[1] = new GLatLng(32.735347,119.328485);
directions.loadFromWaypoints(wp);

Ensuite, vous devez écouter l'événement load pour pouvoir appeler getDuration une fois les instructions résolues:

GEvent.addListener(directions, "load", function() {
    $('log').innerHTML = directions.getDuration ().seconds + " seconds";
        });

Vous pouvez trouver le exemple complet ici et le JavaScript ici . Vous pouvez consulter Documentation Google Maps pour plus d'informations sur les options que vous pouvez donner à l'objet GDirections (comme la distance de marche, etc.). Vous devez également écouter l'événement d'erreur pour les échecs de géocodage.

20
RedBlueThing

La réponse ci-dessus est en violation de Conditions d'utilisation de l'API Google, et donc incorrect .

L'API Google Maps ne vous permet de calculer le temps de trajet que s'il est référencé par rapport à une carte Google affichée à l'utilisateur.

Vous ne pouvez pas utiliser l'API si vous n'affichez pas de carte Google à l'utilisateur final du service.

Mise à jour:

Toute réponse ici, qui ne montre pas les résultats finaux mappés sur une carte Google, est en violation des conditions d'utilisation susmentionnées et, éventuellement, incorrecte.

23
Barry

Pour mémoire : En ce moment (année 2015) GDirections, GLatLng, GEvent, etc. sont obsolètes .

Vous pouvez utiliser classe google.maps.DirectionsService (Google Maps JavaScript API V3)

Dans l'extrait de code suivant, l'emplacement et la cible sont des objets contenant des coordonnées de latitude et de longitude.

1) La classe google.maps.DirectionsService admet les valeurs LatLng et chaîne pour alimenter leurs propriétés d'origine et de destination.
2) Un LatLng est un point en coordonnées géographiques: latitude et longitude.

var Origin = new google.maps.LatLng( location.latitude, location.longitude ); // using google.maps.LatLng class
var destination = target.latitude + ', ' + target.longitude; // using string

var directionsService = new google.maps.DirectionsService();
var request = {
    Origin: Origin, // LatLng|string
    destination: destination, // LatLng|string
    travelMode: google.maps.DirectionsTravelMode.DRIVING
};

directionsService.route( request, function( response, status ) {

    if ( status === 'OK' ) {
        var point = response.routes[ 0 ].legs[ 0 ];
        $( '#travel_data' ).html( 'Estimated travel time: ' + point.duration.text + ' (' + point.distance.text + ')' );
    }
} );
19
Igor Parra

de google.maps.DirectionsRenderer

Distance en utilisant:

directionsDisplay.directions.routes[0].legs[0].distance.text

Durée en utilisant:

directionsDisplay.directions.routes[0].legs[0].duration.text
5
Saurabh Chandra Patel
  1. allez d'abord ici: https://developers.google.com/maps/documentation/distance-matrix/start Vous devez: créer ou sélectionner un projet, activer l'API et obtenir une clé d'API Cliquez simplement sur sur "Obtenir une clé" et en supposant que vous avez un compte Gmail, vous pouvez tout faire fonctionner (vous pouvez également accéder à console.developer.google.com après vous être connecté à votre compte gmail, créer une application, activer l'API et obtenir la clé API là-bas).
  2. allez maintenant à https://developers.google.com/maps/documentation/distance-matrix/intro et suivez les détails. Quelques points à noter: utilisez-les: & mode = driving & depart_time = now & traffic_model = pessimiste si vous voulez que le trafic actuel influence votre temps de conduite. J'ai aussi utilisé & units = imperial

La durée du trafic n'est renvoyée que si toutes les conditions suivantes sont remplies:

La demande comprend un paramètre de départ_heure. La demande comprend une clé API valide ou un ID client et une signature de plan Premium API Google Maps valides. Les conditions de circulation sont disponibles pour l'itinéraire demandé. Le paramètre de mode est réglé sur conduite.

Et oui, vous devez afficher une carte Google avec le temps de trajet "L'API Google Maps Distance Matrix ne peut être utilisée qu'en conjonction avec l'affichage des résultats sur une carte Google. Il est interdit d'utiliser les données de l'API Google Maps Distance Matrix sans afficher de carte Google. "
N'oubliez pas de commander: https://developers.google.com/maps/documentation/distance-matrix/usage-limits et https://developers.google .com/maps/terms pour les CGU.

Notez que Mapquest n'affiche pas les temps de trajet en fonction du trafic réel.

3
Brian Kay Walker

J'ai eu du mal avec cela pendant longtemps, mais j'ai finalement résolu le problème avec un appel AJAX (assurez-vous que vous êtes lié à jQuery pour ce faire).

 //Pass parameters to a function so your user can choose their travel 
 locations

 function getCommuteTime(departLocation, arriveLocation) {
   //Put your API call here with the parameters passed into it
   var queryURL = 
   "https://maps.googleapis.com/maps/api/distancematrix/json?
   units=imperial&origins=" + departLocation + "&destinations=" + 
   arriveLocation + "&key=YOUR_API_KEY"

  //Ajax retrieves data from the API
  $.ajax({
  url: queryURL,
  method: "GET"
  }).then(function(response) {

    //Navigate through the given object to the data you want (in this 
     case, commute time)
    var commuteTime = response.rows[0].elements[0].duration.text;

    console.log(commuteTime)
   });

  } 


//This is where your user can give you the data you need
$("#addRoute").on("click", function(event) {

event.preventDefault();

var departLocation = $("#departInput").val().trim();
var arriveLocation = $("#arriveInput").val().trim();

//call the above function
getCommuteTime(departLocation, arriveLocation);
  });
2
Sasha Patsel