2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
tanyvillalbav@gmail.com Sign out

Google Maps JavaScript API 3 X

Buscar

Inicio

Productos

Conferencias

Escaparate

Live

Grupos

Versin 3 del API de JavaScript de Google Maps

Gua para desarrolladores Introduccin Lmites de uso y facturacin Conceptos Eventos Controles Estilos Superposiciones Capas Tipos de mapas Servicios Rutas Matriz de distancia Elevacin Codificacin geogrfica Imgenes con nivel de zoom mximo Street View Bibliotecas Referencia del API Ejemplos de cdigo Ms recursos Blog Foro Preguntas frecuentes ---------API de Google Maps for Business Servicios web del API de Google Maps { API de Google Places API de Google Static Maps API de imgenes de Street View API de Google Earth API obsoletas origin: LatLng | String , destination: LatLng | String , travelMode: TravelMode, transitOptions: TransitOptions, unitSystem: UnitSystem, waypoints[]: DirectionsWaypoint , optimizeWaypoints: Boolean , provideRouteAlternatives: Boolean ,

Comentar este documento

Servicio de rutas
Descripcin general Solicitudes de rutas Medios de transporte Opciones de transporte pblico Sistemas de unidades Cmo especificar la regin para obtener rutas Cmo procesar rutas Cdigos de estado de las rutas Cmo visualizar DirectionsResult El objeto DirectionsResults Rutas Tramos Pasos Informacin especfica sobre transporte pblico Cmo inspeccionar DirectionsResults Cmo usar hitos en las rutas Rutas arrastrables

Descripcin general
El objeto DirectionsService permite obtener rutas para distintos medios de transporte. Este objeto se comunica con el servicio de rutas del API de Google Maps, que recibe solicitudes de rutas y devuelve los resultados calculados. Puedes trabajar directamente con estos resultados de rutas o utilizar el objeto DirectionsRenderer para procesarlos. Las rutas pueden especificar los orgenes y los destinos como cadenas de texto (por ejemplo, "Chicago, IL" o "Darwin, NSW, Australia") o como valores LatLng. El servicio de rutas puede devolver rutas segmentadas mediante una serie de hitos. Las rutas se muestran como polilneas que trazan la ruta en un mapa, o tambin como una serie de descripciones textuales en un elemento <div> (por ejemplo, "Gira a la derecha en la salida Williamsburg Bridge").

Solicitudes de rutas
El acceso al servicio de rutas tiene lugar de forma asncrona, ya que el API de Google Maps debe hacer una llamada a un servidor externo. Por ese motivo, debes incluir un mtodo de devolucin de llamada para que se ejecute al completar la solicitud. Este mtodo de devolucin de llamada procesar los resultados. Ten en cuenta que el servicio de rutas puede devolver ms de un posible itinerario como un conjunto de rutas (routes[]) independientes. Para utilizar rutas en la versin 3, crea un objeto de tipo DirectionsService y ejecuta DirectionsService.route() para iniciar una solicitud al servicio de rutas, incluyendo un objeto literal DirectionsRequest que contiene los trminos de entrada y un mtodo de devolucin de llamada que se ejecutar al recibir la respuesta. El objeto literal DirectionsRequest contiene los siguientes campos:

https://developers.google.com/maps/documentation/javascript/directions

1/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
avoidHighways: Boolean , avoidTolls: Boolean region: String } A continuacin, se explican estos campos. origin (obligatorio): especifica la ubicacin de salida desde la que se calcularn las rutas. Este valor se puede especificar como String (por ejemplo, "Chicago, IL") o como LatLng. destination (obligatorio): especifica la ubicacin de llegada hasta la que se calcularn las rutas. Este valor se puede especificar como String (por ejemplo, "Chicago, IL") o como LatLng. travelMode (obligatorio): especifica el medio de transporte que se utilizar al calcular las rutas. Los valores vlidos se especifican en la seccin Medios de transporte que aparece a continuacin. transitOptions (opcional): especifica los valores que se aplican nicamente a las solicitudes donde travelMode se corresponde con google.maps.TravelMode.TRANSIT . Los valores vlidos se describen en la seccin Opciones de transporte pblico que aparece a continuacin. unitSystem (opcional): especifica el sistema de unidades que se utilizar para mostrar los resultados. Los valores vlidos se especifican en la seccin Sistemas de unidades que aparece a continuacin. waypoints[] (opcional): especifica un conjunto de hitos (DirectionsWaypoint). Los hitos modifican una ruta al hacerla pasar por ubicaciones concretas. Un hito se especifica como un objeto literal con los campos indicados a continuacin. location especifica la ubicacin del hito como LatLng o como String que se codificar geogrficamente. stopover es un valor booleano que indica que el hito es una parada en la ruta, lo cual provoca que la ruta se divida en dos rutas diferentes. (Para obtener ms informacin sobre los hitos, consulta la seccin Cmo usar hitos en las rutas que aparece a continuacin). optimizeWaypoints (opcional): especifica que la ruta con los hitos waypoints proporcionados se puede optimizar para proporcionar la ruta ms corta posible. Si su valor es true, el servicio de rutas devuelve los hitos waypoints ordenados de nuevo en un campo waypoint_order .Para obtener ms informacin, consulta la seccin Cmo usar hitos en las rutas que aparece a continuacin. provideRouteAlternatives (opcional): si se establece en true, indica que el servicio de rutas puede devolver ms de una ruta alternativa en la respuesta. Ten en cuenta que la obtencin de rutas alternativas puede incrementar el tiempo de respuesta del servidor. avoidHighways (opcional): si se establece en true, indica que las rutas calculadas deben evitar, si es posible, las principales carreteras. avoidTolls (opcional): si se establece en true, indica que las rutas calculadas deben evitar, si es posible, las autopistas de peaje. region (opcional): es el cdigo de regin, especificado como un valor de dos caracteres ccTLD ("dominio de nivel superior"). Para obtener ms informacin, consulta la seccin Cmo especificar la regin para obtener rutas que aparece a continuacin. A continuacin, se muestra una solicitud DirectionsRequest de ejemplo: { origin: "Chicago, IL", destination: "Los Angeles, CA", waypoints: [ { location:"Joplin, MO", stopover:false },{ location:"Oklahoma City, OK", stopover:true }], provideRouteAlternatives: false, travelMode: TravelMode.DRIVING, unitSystem: UnitSystem.IMPERIAL }

Medios de transporte
Al calcular rutas, es necesario especificar el medio de transporte que se debe utilizar. A continuacin, se indican los medios

https://developers.google.com/maps/documentation/javascript/directions

2/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
de transporte que se admiten actualmente. google.maps.TravelMode.DRIVING (predeterminado): proporciona rutas estndar para llegar en coche a travs de la red de carreteras. google.maps.TravelMode.BICYCLING: solicita rutas para llegar en bicicleta a travs de carriles bici y vas preferenciales para bicicletas. google.maps.TravelMode.TRANSIT solicita rutas de transporte pblico. google.maps.TravelMode.WALKING solicita rutas a pie a travs de aceras y rutas peatonales. Consulta la hoja de clculo de cobertura de Google Maps para determinar en qu medida admite un pas la presentacin de rutas. Si solicita rutas para una regin donde ese tipo de ruta no est disponible, la respuesta devolver DirectionsStatus como ZERO_RESULTS. Las rutas para llegar a pie a veces no incluyen rutas peatonales evidentes, por lo que devuelven advertencias en DirectionsRenderer que debes visualizar si no utilizas el procesador predeterminado DirectionsResult.

Opciones de transporte pblico

Actualmente, el servicio de transporte pblico est en perodo de prueba. Durante esta fase, implementaremos lmites para evitar abusos del API. Finalmente, estableceremos un lmite en el nmero total de consultas por carga de mapa para que se realice un uso responsable del API. Las opciones disponibles para una solicitud de rutas vara segn el modo de transporte. Cuando se soliciten rutas de transporte pblico, las opciones avoidHighways, avoidTolls, waypoints[] y optimizeWaypoints se ignorarn. Puedes establecer opciones especficas de rutas de transporte pblico mediante el objeto literal TransitOptions. Las rutas de transporte pblico varan segn los valores temporales. Las rutas solo se devolvern para valores temporales futuros. El objeto literal TransitOptions contiene los siguientes campos: { departureTime: Date, arrivalTime: Date } A continuacin, se explican estos campos: departureTime (opcional): especifica la fecha de salida deseada como un objeto Date. El campo departureTime se ignorar si se especifica arrivalTime. Si no se especifica ni departureTime ni arrivalTime, se establecer la el valor temporal actual de forma predeterminada. arrivalTime (opcional): especifica la fecha de llegada deseada como un objeto Date. Si se especifica la fecha de llegada, la fecha de salida se ignorar. A continuacin, se muestra un ejemplo de solicitud de rutas (DirectionsRequest) mediante transporte pblico:

{ origin: "Hoboken NJ", destination: "Carroll Gardens, Brooklyn", travelMode: google.maps.TravelMode.TRANSIT, transitOptions: { departureTime: new Date(1337675679473) }, unitSystem: google.maps.UnitSystem.IMPERIAL }

Sistemas de unidades
De forma predeterminada, las rutas se calculan y se muestran en el sistema de unidades del pas o de la regin de origen (nota: los orgenes expresados mediante coordenadas de latitud y longitud en lugar de direcciones se convierten siempre en unidades mtricas de forma predeterminada). Por ejemplo, una ruta de "Chicago, IL" a "Toronto, ONT" mostrar los resultados

https://developers.google.com/maps/documentation/javascript/directions

3/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
en millas, mientras que la ruta inversa mostrar los resultados en kilmetros. Para anular este sistema de unidades predeterminado, basta con que definas en la solicitud uno de ellos de forma explcita mediante cualquiera de los siguientes valores UnitSystem: UnitSystem.METRIC indica el uso del sistema mtrico. Las distancias se muestran en kilmetros. UnitSystem.IMPERIAL indica el uso del sistema imperial (britnico). Las distancias se muestran en millas. Nota: esta configuracin del sistema de unidades solo afecta al texto que se muestra al usuario. El resultado de las rutas incluye tambin valores de distancia, que no se muestran al usuario y que siempre se expresan en metros.

Cmo especificar la regin para obtener rutas

El servicio de rutas del API de Google Maps devuelve resultados de rutas en funcin del dominio (la regin o el pas) desde el que se carg la solicitud de inicializacin de JavaScript. Dado que la mayora de los usuarios cargan http://maps.google.com/, esto supone la definicin del dominio implcito correspondiente a Estados Unidos. Si cargas la solicitud de inicializacin desde un dominio compatible diferente, puede que los resultados se vean influidos por dicho dominio. Por ejemplo, las bsquedas de "San Francisco" pueden devolver diferentes resultados en funcin de que las aplicaciones carguen http://maps.google.com/ (Estados Unidos) o http://maps.google.es/ (Espaa). Tambin puedes especificar que el servicio de rutas devuelva resultados asociados a una regin en concreto mediante el parmetro region. Este parmetro toma un cdigo de regin, especificado como una subetiqueta region en lenguaje IANA. En la mayora de los casos, estas etiquetas se asignan directamente a valores de dos caracteres ccTLD ("dominio de nivel superior") como, por ejemplo, "uk" en "co.uk". En algunos casos, la etiqueta region tambin admite cdigos ISO-3166-1, que a veces son diferentes de los valores ccTLD (por ejemplo, "GB" para "Gran Bretaa"). Consulta la hoja de clculo de cobertura de Google Maps para determinar en qu medida admite un pas la presentacin de rutas.

Cmo procesar rutas

El inicio de una solicitud de rutas al servicio DirectionsService mediante el mtodo route() requiere la transmisin de una devolucin de llamada que se ejecuta al finalizar la solicitud de servicio. Esta devolucin de llamada devuelve DirectionsResult y un cdigo DirectionsStatus en la respuesta.

Estado de la consulta de rutas

DirectionsStatus puede devolver los siguientes valores: OK indica que la respuesta contiene un resultado DirectionsResult vlido. NOT_FOUND indica que al menos una de las ubicaciones especificadas en el origen, el destino o los hitos de la solicitud no se pudo codificar de forma geogrfica. ZERO_RESULTSindica que no se pudo encontrar ninguna ruta entre el origen y el destino. MAX_WAYPOINTS_EXCEEDED indica que se proporcionaron demasiados hitos (DirectionsWaypoint) en DirectionsRequest. El nmero mximo de hitos permitido es ocho, adems del origen y del destino. Los clientes del API de Google Maps for Business pueden utilizar hasta 23 hitos, adems del origen y del destino. En las rutas de transporte pblico no se admiten hitos. INVALID_REQUEST indica que la solicitud DirectionsRequest proporcionada no era vlida. Las causas ms comunes de este cdigo de error son las solicitudes que no incluyen un origen o un destino, o las solicitudes de transporte pblico que incluyen hitos. OVER_QUERY_LIMIT indica que la pgina web ha enviado demasiadas solicitudes dentro del perodo de tiempo permitido. REQUEST_DENIED indica que no se permite el uso del servicio de rutas en la pgina web. UNKNOWN_ERROR indica que no se ha podido procesar una solicitud de rutas debido a un error del servidor. Puede que la solicitud se realice correctamente si lo intentas de nuevo. Debes asegurarte de que la consulta de rutas devuelva resultados vlidos. Para ello, comprueba este valor antes de procesar el resultado.

Cmo visualizar DirectionsResult

DirectionsResult contiene el resultado de la consulta de rutas, que puedes controlar directamente o transmitirlo a un objeto DirectionsRenderer , que mostrar automticamente el resultado en un mapa.

https://developers.google.com/maps/documentation/javascript/directions

4/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
Para mostrar un resultado DirectionsResult mediante un objeto DirectionsRenderer , sigue los siguientes pasos: 1. Crea un objeto DirectionsRenderer . 2. Ejecuta setMap() en el procesador para vincularlo al mapa transmitido. 3. Ejecuta setDirections() en el procesador, transmitindole DirectionsResult tal y como se ha indicado anteriormente. Dado que el procesador es un objeto MVCObject, detecta automticamente cualquier cambio introducido en sus propiedades y actualiza el mapa cuando se modifican las rutas asociadas. En el siguiente ejemplo se calculan las rutas entre dos ubicaciones de la ruta 66, en las que los valores "start" y "end" proporcionados en las listas desplegables determinan el origen y el destino. DirectionsRenderer controla la visualizacin de la polilnea entre las ubicaciones indicadas, as como la colocacin, si corresponde, de marcadores en el origen, en el destino y en los hitos. var directionsDisplay; var directionsService = new google.maps.DirectionsService(); var map; function initialize() { directionsDisplay = new google.maps.DirectionsRenderer(); var chicago = new google.maps.LatLng (41.850033, -87.6500523); var mapOptions = { zoom:7, mapTypeId: google.maps.MapTypeId .ROADMAP, center: chicago } map = new google.maps.Map (document.getElementById("map_canvas"), mapOptions); directionsDisplay.setMap(map); } function calcRoute() { var start = document.getElementById("start").value; var end = document.getElementById("end").value; var request = { origin:start, destination:end, travelMode: google.maps.TravelMode.DRIVING }; directionsService.route(request, function (result, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(result); } }); } En el cuerpo HTML: <div> <strong>Start: </strong> <select id="start" onchange="calcRoute();"> <option value="chicago, il">Chicago</option> <option value="st louis, mo">St Louis</option> <option value="joplin, mo">Joplin, MO</option> <option value="oklahoma city, ok">Oklahoma City </option> <option value="amarillo, tx">Amarillo</option> <option value="gallup, nm">Gallup, NM</option> <option value="flagstaff, az">Flagstaff, AZ </option> <option value="winona, az">Winona</option> <option value="kingman, az">Kingman</option> <option value="barstow, ca">Barstow</option> <option value="san bernardino, ca">San Bernardino</option> <option value="los angeles, ca">Los Angeles</option> </select> <strong>End: </strong> <select id="end" onchange="calcRoute();"> <option value="chicago, il">Chicago</option> <option value="st louis, mo">St Louis</option> <option value="joplin, mo">Joplin, MO</option>

https://developers.google.com/maps/documentation/javascript/directions

5/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
<option value="oklahoma city, ok">Oklahoma City </option> <option value="amarillo, tx">Amarillo</option> <option value="gallup, nm">Gallup, NM</option> <option value="flagstaff, az">Flagstaff, AZ </option> <option value="winona, az">Winona</option> <option value="kingman, az">Kingman</option> <option value="barstow, ca">Barstow</option> <option value="san bernardino, ca">San Bernardino</option> <option value="los angeles, ca">Los Angeles</option> </select> </div> Ver ejemplo (directions-simple.html) En el siguiente ejemplo se muestran rutas con distintos medios de transporte entre Haight-Ashbury y Ocean Beach en San Francisco (California, Estados Unidos): var directionsDisplay; var directionsService = new google.maps.DirectionsService(); var map; var haight = new google.maps.LatLng (37.7699298, -122.4469157); var oceanBeach = new google.maps.LatLng (37.7683909618184, -122.51089453697205); function initialize() { directionsDisplay = new google.maps.DirectionsRenderer(); var mapOptions = { zoom: 14, mapTypeId: google.maps.MapTypeId .ROADMAP, center: haight } map = new google.maps.Map (document.getElementById("map_canvas"), mapOptions); directionsDisplay.setMap(map); } function calcRoute() { var selectedMode = document.getElementById("mode").value; var request = { origin: haight, destination: oceanBeach, // Note that Javascript allows us to access the constant // using square brackets and a string value as its // "property." travelMode: google.maps.TravelMode[selectedMode] }; directionsService.route(request, function (response, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(response); } }); } En el cuerpo HTML: <div> <strong>Mode of Travel: </strong> <select id="mode" onchange="calcRoute();"> <option value="DRIVING">Driving</option> <option value="WALKING">Walking</option> <option value="BICYCLING">Bicycling</option> <option value="TRANSIT">Transit</option> </select> </div> Ver ejemplo (directions-travel-modes.html) DirectionsRenderer no solo controla la visualizacin de la polilnea y cualquier marcador asociado, sino que tambin controla la

https://developers.google.com/maps/documentation/javascript/directions

6/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
visualizacin textual de las rutas en forma de una serie de pasos. Para ello, basta con ejecutar setPanel() en DirectionsRenderer , transmitindole el elemento <div> en el que se mostrar esta informacin. De esta forma, tambin se garantiza la visualizacin de la correspondiente informacin sobre derechos de autor y cualquier advertencia asociada a los resultados. Las indicaciones textuales se proporcionan en la configuracin de idioma preferida del navegador, o en el idioma especificado al cargar el API JavaScript mediante el parmetro language (para obtener ms informacin, consulta la seccin Localizacin). En el caso de las rutas de transporte pblico, el valor de tiempo se mostrar en la zona correspondiente de la parada en cuestin. El ejemplo que aparece a continuacin es idntico al mostrado anteriormente, con la diferencia de que incluye un panel <div> en el que se mostrarn las rutas: var directionsDisplay; var directionsService = new google.maps.DirectionsService(); var map; function initialize() { directionsDisplay = new google.maps.DirectionsRenderer(); var chicago = new google.maps.LatLng (41.850033, -87.6500523); var mapOptions = { zoom:7, mapTypeId: google.maps.MapTypeId .ROADMAP, center: chicago } map = new google.maps.Map (document.getElementById("map_canvas"), mapOptions); directionsDisplay.setMap(map); directionsDisplay.setPanel(document.getElementById("directionsPanel")); } function calcRoute() { var start = document.getElementById("start").value; var end = document.getElementById("end").value; var request = { origin:start, destination:end , travelMode: google.maps.TravelMode.DRIVING }; directionsService.route(request, function (response, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(response); } }); } En el cuerpo HTML: <div id="map_canvas" style="float :left;width :70% ; height :100% "></div> <div id="directionsPanel" style="float :right;width :30% ;height 100% "></div> Ver ejemplo (directions-panel.html)

El objeto DirectionsResult
Al enviar una solicitud de rutas a DirectionsService, recibirs una respuesta que constar de un cdigo de estado y un resultado, que es un objeto DirectionsResult. DirectionsResult es un objeto literal con un nico campo: routes[] consta de un conjunto de objetos DirectionsRoute. Cada ruta indica una forma de llegar desde el origen al destino proporcionados en DirectionsRequest. Normalmente, solo se devuelve una ruta por solicitud, a menos que se haya establecido el campo provideRouteAlternatives de la solicitud en true, en cuyo caso se pueden devolver varias rutas.

Rutas
El objeto DirectionsTrip heredado se llama ahora DirectionsRoute. Ten en cuenta que una ruta se refiere ahora a todo un viaje de principio a fin, en lugar de a un solo tramo del viaje principal.

https://developers.google.com/maps/documentation/javascript/directions

7/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
DirectionsRoute contiene un solo resultado del origen y del destino especificados. Esta ruta puede constar de uno o ms tramos (de tipo DirectionsLeg) en funcin de si se han especificado hitos. Adems, la ruta tambin incluye informacin de derechos de autor y advertencias que se deben mostrar al usuario junto con la informacin de la ruta. DirectionsRoute es un objeto literal que contiene los siguientes campos: legs[] contiene un conjunto de objetos DirectionsLeg, cada uno de los cuales incluye informacin sobre un tramo de la ruta entre dos ubicaciones incluidas en ella. Se presentar un tramo diferente por cada hito o destino especificado (una ruta sin hitos incluye exactamente un objeto DirectionsLeg). Cada tramo consta de una serie de pasos DirectionStep. waypoint_order incluye un conjunto que indica el orden de los hitos de la ruta calculada. El orden de este conjunto puede verse modificado si se transmite optimizeWaypoints: true a DirectionsRequest. overview_path contiene un conjunto de objetos LatLng que representan una ruta aproximada (suavizada) de las rutas resultantes. bounds contiene un objeto LatLngBounds que indica los lmites de la polilnea a lo largo de la ruta especificada. copyrights contiene el texto de los derechos de autor que se mostrar con la ruta. Si no utilizas el objeto DirectionsRenderer proporcionado, debers gestionar y mostrar esta informacin t mismo. warnings[] contiene un conjunto de advertencias que se visualizar cuando se muestren las rutas. Si no utilizas el objeto DirectionsRenderer proporcionado, debers gestionar y mostrar estas advertencias t mismo.

Tramos
El objeto DirectionsRoute heredado se llama ahora DirectionsLeg. DirectionsLeg define un nico tramo de un viaje desde el origen hasta el destino de la ruta calculada. Las rutas que no contengan hitos constarn de un nico "tramo", mientras que las rutas en las que se hayan definido uno o varios hitos constarn de uno o varios tramos correspondientes a los tramos especficos del trayecto. DirectionsLeg es un objeto literal que contiene los siguientes campos: steps[] contiene un conjunto de objetos DirectionsStep que proporciona informacin sobre cada uno de los pasos del tramo del viaje. distance indica la distancia total que abarca el tramo, como un objeto Distance que adopta la siguiente forma: value indica la distancia en metros. text contiene una representacin en cadena de la distancia, que se muestra de forma predeterminada en el sistema de unidades que se utilizan en la ubicacin de origen (por ejemplo, se utilizan millas para cualquier ubicacin de origen perteneciente a Estados Unidos). Para anular este sistema de unidades, define UnitSystem especficamente en la consulta original. Ten en cuenta que el campo distance.value siempre contendr un valor expresado en metros, independientemente del sistema de unidades que utilices. Si se desconoce la distancia, es posible que estos campos no estn definidos. duration indica la duracin total del tramo, como un objeto Duration que adopta la siguiente forma: value indica la duracin en segundos. text contiene una representacin en cadena de la duracin. Si se desconoce la duracin, es posible que estos campos no estn definidos. arrival_time contiene la hora estimada de llegada de este tramo. Esta propiedad solo se transmite para rutas de transporte pblico. El resultado se devuelve como un objeto Time con tres propiedades: value: valor de tiempo especificado como objeto de fecha (Date) de JavaScript. text: valor de tiempo especificado como cadena. El valor de tiempo se muestra en la zona correspondiente situada en la parte superior de la parada de transporte pblico. time_zone contiene la zona donde se muestra el valor de tiempo de esta estacin. El valor es el nombre de la zona donde se muestra el valor de tiempo, tal y como se define en la base de datos de zonas de tiempo de IANA, por ejemplo, "Amrica/Nueva_York". departure_time contiene la hora estimada de llegada de este tramo, especificada como un objeto Time. El elemento departure_time solo se transmite para rutas de transporte pblico. start_location contiene el valor LatLng del origen de este tramo. Dado que el servicio web de rutas utiliza la opcin de transporte ms cercana a los puntos de partida y de llegada (normalmente, carreteras) para calcular las rutas entre dos ubicaciones, es posible que el valor start_location no coincida con el origen del tramo si, por ejemplo, no hay carreteras cercanas al mismo.

https://developers.google.com/maps/documentation/javascript/directions

8/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
end_location contiene el valor LatLng del destino de este tramo. Dado que DirectionsService utiliza la opcin de transporte ms cercana a los puntos de partida y de llegada (normalmente, carreteras) para calcular las rutas entre dos ubicaciones, es posible que el valor end_location no coincida con el destino del tramo si, por ejemplo, no hay carreteras cerca del mismo. start_address contiene la direccin interpretable por humanos (normalmente una calle) del inicio de este tramo. end_address contiene la direccin interpretable por humanos (normalmente una calle) del fin de este tramo.

Pasos
DirectionsStep es la unidad ms pequea de una ruta e incluye un solo paso que describe una nica instruccin especfica del viaje. Por ejemplo, "Gira a la izquierda en la calle W. 4th St.". Un paso no solo describe una instruccin, sino que tambin contiene informacin sobre la distancia y sobre el tiempo con respecto al paso siguiente. Por ejemplo, es posible que el paso etiquetado como "Tome la interestatal 80 oeste" especifique una duracin de "60 kilmetros" y de "40 minutos" para indicar que el siguiente paso se encuentra a 60 kilmetros/40 minutos. Cuando se utiliza el servicio de rutas para buscar rutas de transporte pblico, el conjunto de pasos incluye informacin especfica sobre transporte pblico en forma de un objeto transit. Si en las rutas se incluyen varios medios de transporte, se proporcionarn rutas detalladas para los pasos a pie y en coche en un conjunto steps[]. Por ejemplo, un paso a pie incluir rutas desde las ubicaciones de partida y de llegada: "Camina hasta la calle Innes Ave & Fitch St". Este paso incluir rutas a pie detalladas para la ruta del conjunto steps[], por ejemplo: "Dirgete hacia el noroeste", "Gira a la izquierda en Arelious Walker" y "Gira a la izquierda en Innes Ave". DirectionsStep es un objeto literal que contiene los siguientes campos: instructions contiene instrucciones para este paso dentro de una cadena de texto. distance contiene la distancia entre este paso y el siguiente, como un objeto Distance (consulta la descripcin de DirectionsLeg indicada anteriormente). Si no se conoce la distancia, es posible que este campo no est definido. duration contiene el tiempo estimado necesario para realizar el recorrido entre este paso y el siguiente, como un objeto Duration (consulta la descripcin de DirectionsLeg indicada anteriormente). Si no se conoce la duracin, es posible que este campo no est definido. start_location contiene el valor LatLng codificado geogrficamente del punto de partida de este paso. end_location contiene el valor LatLng del punto de llegada de este paso. steps[] es un objeto literal DirectionsStep que contiene rutas detalladas a pie o en coche para rutas de transporte pblico. Los subpasos solo se encuentran disponibles para rutas de transporte pblico. travel_mode contiene el modo TravelMode utilizado en este paso. Las rutas de transporte pblico pueden incluir una combinacin de rutas a pie y de transporte pblico. path contiene un conjunto de elementos LatLngs que describe el recorrido de este paso. transit contiene informacin especfica sobre transporte pblico como, por ejemplo, las horas de salida y llegada y el nombre de la lnea de transporte pblico.

Informacin especfica sobre transporte pblico

Las rutas de transporte pblico devuelven informacin adicional que no es relevante para otros medios de transporte. Estas propiedades adicionales se exponen mediante el objeto TransitDetails, que se devuelve como propiedad de DirectionsStep. Desde el objeto TransitDetails puedes acceder a informacin adicional sobre los objetos TransitStop, TransitLine, TransitAgency y VehicleType, tal y como se describe a continuacin.

Detalles de transporte pblico

El objeto TransitDetails expone las siguientes propiedades: arrival_stop contiene un objeto TransitStop que representa la estacin o parada de llegada e incluye las siguientes propiedades: name: nombre de la estacin o la parada (por ejemplo, "Union Square"), location: ubicacin de la estacin o parada de transporte pblico, representada como un objeto LatLng. departure_stop contiene un objeto TransitStop que representa la estacin o parada de salida. arrival_time contiene la hora de llegada, especificada como un objeto Time con tres propiedades: value: valor de tiempo especificado como objeto de fecha (Date) de JavaScript, text: valor de tiempo especificado como cadena (el valor de tiempo se muestra en la zona correspondiente situada en la parte superior de la parada de transporte pblico), time_zone contiene la zona donde se muestra el valor de tiempo de esta estacin (el valor es el nombre de la zona donde se muestra el valor de tiempo, tal y como se define en la base de datos de zonas de tiempo de IANA, por

https://developers.google.com/maps/documentation/javascript/directions

9/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
ejemplo, "Amrica/Nueva_York"). departure_time contiene la hora de salida, especificada como un objeto Time. headsign especifica la direccin en la que viaja la lnea, tal y como aparece en el vehculo o en la parada de salida. Generalmente esta ser la ltima estacin. headway , cuando se encuentra disponible, especifica el nmero previsto de segundos entre salidas de la misma parada en ese momento. Por ejemplo, con un valor headway de 600, podras prever una espera de diez minutos si perdieras el autobs. line contiene un objeto literal TransitLine que incluye informacin sobre la lnea de transporte pblico utilizada en este paso. El objeto TransitLine proporciona el nombre y el operador de la lnea, as como otras propiedades descritas en la documentacin de referencia de TransitLine. num_stops contiene el nmero de paradas de este paso. Incluye la parada de llegada, pero no la de salida. Por ejemplo, si las rutas implican salir de la parada A, pasando por las paradas B y C hasta llegar a la parada D, num_stops devolver 3 paradas.

Lnea de transporte pblico

El objeto TransitLine expone las siguientes propiedades: name contiene el nombre completo de la lnea de transporte pblico. Por ejemplo: "7 Avenue Express" o "14th St Crosstown". short_name contiene el nombre abreviado de la lnea de transporte pblico. Generalmente este ser un nmero de lnea como, por ejemplo, "2" o "M14". agencies incluye un conjunto de objetos de tipo TransitAgency . Cada uno de los objetos TransitAgency proporciona informacin sobre el operador de la lnea e incluye las siguientes propiedades: name contiene el nombre de la empresa de transporte pblico. url contiene la URL de la empresa de transporte pblico. phone contiene el nmero de telfono de la empresa de transporte pblico. Si procesas rutas de transporte pblico de forma manual en lugar de utilizar el objeto DirectionsRenderer , debes mostrar los nombres y las URL de las empresas de transporte pblico que prestan sus servicios para realizar los recorridos que aparecen en los resultados. url contiene la URL de esta lnea de transporte pblico tal y como la proporciona la empresa de transporte. icon contiene una URL correspondiente al icono asociado a esta lnea. La mayora de las ciudades utiliza iconos genricos que varan segn el tipo de vehculo. Algunas lneas de transporte como, por ejemplo, el sistema de metro de Nueva York, tienen iconos especficos para cada lnea. color contiene el color que se utiliza normalmente para sealizar el transporte en cuestin. El color se especificar como una cadena hexadecimal similar a esta: #FF0033. text_color contiene el color del texto que se utiliza normalmente para sealizar la lnea en cuestin. El color se especificar como una cadena hexadecimal. vehicle contiene un objeto Vehicle que incluye la siguientes propiedades: name contiene el nombre del vehculo de la lnea. Por ejemplo: "Metro". type contiene el tipo de vehculo utilizado en la lnea en cuestin. Para obtener una lista completa de los valores admitidos, consulta la documentacin sobre el tipo de vehculo. icon contiene una URL correspondiente al icono asociado normalmente al tipo de vehculo en cuestin. local_ icon contiene una URL correspondiente al icono asociado al tipo de vehculo en cuestin a nivel local.

Tipo de vehculo
El objeto VehicleType expone las siguientes propiedades: Valor VehicleType.RAIL VehicleType.METRO_RAIL VehicleType.SUBWAY VehicleType.TRAM VehicleType.MONORAIL VehicleType.HEAVY_RAIL Definicin Ferrocarril Tren ligero Metro ligero Tranva Monorral Tren pesado

https://developers.google.com/maps/documentation/javascript/directions

10/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
VehicleType.COMMUTER_TRAIN VehicleType.HIGH_SPEED_TRAIN VehicleType.BUS VehicleType.INTERCITY_BUS VehicleType.TROLLEYBUS VehicleType.SHARE_TAXI Tren de cercanas Tren de alta velocidad Autobs Autocar Trolebs Taxi colectivo (vehculo que recoge y deposita a los pasajeros en cualquier lugar de la ruta que se le ha asignado) VehicleType.FERRY VehicleType.CABLE_CAR Ferry Telefrico (vehculo que se desplaza por un cable, generalmente sobre el suelo; estos vehculos pueden ser del tipo VehicleType.GONDOLA_LIFT ) VehicleType.GONDOLA_LIFT VehicleType.FUNICULAR Telecabina (telefrico) Funicular (vehculo que se utiliza para subir pendientes mediante un cable; suele estar formado por dos cabinas que actan como contrapeso una de la otra) VehicleType.OTHER Para el resto de vehculos se devolver este tipo.

Cmo inspeccionar DirectionsResults

Los componentes DirectionsResults (DirectionsRoute, DirectionsLeg, DirectionsStep y TransitDetails) se pueden inspeccionar y utilizar al analizar cualquier respuesta de rutas. Importante: si procesas rutas de transporte pblico de forma manual en lugar de utilizar el objeto DirectionsRenderer , debes mostrar los nombres y las URL de las empresas de transporte pblico que prestan sus servicios para realizar los recorridos que aparecen en los resultados. En el siguiente ejemplo, se muestran las rutas para llegar a pie entre determinadas atracciones tursticas de la ciudad de Nueva York. Inspeccionamos el componente DirectionsStep de la ruta para aadir marcadores en cada paso y asociamos informacin a una ventana de informacin (InfoWindow) con instrucciones para dichos pasos. Como calculamos rutas para llegar a pie, tambin mostraremos advertencias al usuario en un panel <div> independiente.

var map; var directionsDisplay; var directionsService; var stepDisplay; var markerArray = []; function initialize() { // Instantiate a directions service. directionsService = new google.maps.DirectionsService(); // Create a map and center it on Manhattan. var manhattan = new google.maps.LatLng (40.7711329, -73.9741874); var mapOptions = { zoom: 13, mapTypeId: google.maps.MapTypeId .ROADMAP, center: manhattan } map = new google.maps.Map (document.getElementById("map_canvas"), mapOptions); // Create a renderer for directions and bind it to the map. var rendererOptions = { map: map } directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions) // Instantiate an info window to hold step text. stepDisplay = new google.maps.InfoWindow();

https://developers.google.com/maps/documentation/javascript/directions

11/15

2/04/13
}

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers

function calcRoute() { // First, clear out any existing markerArray // from previous calculations. for (i = 0; i < markerArray.length; i++) { markerArray[i].setMap( null); } // Retrieve the start and end locations and create // a DirectionsRequest using WALKING directions. var start = document.getElementById("start").value; var end = document.getElementById("end").value; var request = { origin: start, destination: end , travelMode: google.maps.TravelMode.WALKING }; // Route the directions and pass the response to a // function to create markers for each step. directionsService.route(request, function (response, status) { if (status == google.maps.DirectionsStatus.OK) { var warnings = document.getElementById("warnings_panel"); warnings.innerHTML = "" + response.routes[0].warnings + ""; directionsDisplay.setDirections(response); showSteps(response); } }); } function showSteps(directionResult) { // For each step, place a marker, and add the text to the marker's // info window. Also attach the marker to an array so we // can keep track of it and remove it when calculating new // routes. var myRoute = directionResult.routes[0].legs[0]; for ( var i = 0; i < myRoute.steps.length; i++) { var marker = new google.maps.Marker({ position: myRoute.steps[i].start_point, map: map }); attachInstructionText(marker, myRoute.steps[i].instructions); markerArray[i] = marker; } } function attachInstructionText(marker, text) { google.maps.event .addListener(marker, 'click', function () { stepDisplay.setContent(text); stepDisplay.open(map, marker); }); } En el cuerpo HTML: <div> <strong>Start: </strong> <select id="start"> <option value="penn station, new york, ny">Penn Station</option> <option value="grand central station, new york, ny">Grand Central Station</option> <option value="625 8th Avenue New York NY 10018">Port Authority Bus Terminal</option> <option value="staten island ferry terminal, new york, ny">Staten Island Ferry Terminal</option> <option value="101 E 125th Street, New York, NY">Harlem - 125th St Station</option> </select> <strong>End: </strong>

https://developers.google.com/maps/documentation/javascript/directions

12/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
<select id="end" onchange="calcRoute();"> <option value="260 Broadway New York NY 10007">City Hall</option> <option value="W 49th St & 5th Ave, New York, NY 10020">Rockefeller Center </option> <option value="moma, New York, NY">MOMA</option> <option value="350 5th Ave, New York, NY, 10118">Empire State Building</option> <option value="253 West 125th Street, New York, NY">Apollo Theatre</option> <option value="1 Wall St, New York, NY">Wall St</option> </select> <div> Ver ejemplo (directions-complex.html)

Cmo usar hitos en las rutas

Tal y como se indica en la seccin relativa a DirectionsRequest, tambin puedes especificar hitos (de tipo DirectionsWaypoint) al calcular rutas con el servicio de rutas para llegar a pie, en bicicleta o en coche. Los hitos no estn disponibles en las rutas de transporte pblico. Los hitos permiten calcular rutas que pasen por ubicaciones adicionales, de modo que la ruta devuelta atraviese hitos concretos. El nmero mximo de hitos permitido es ocho, adems del origen y del destino. Los clientes del API de Google Maps for Business pueden utilizar hasta 23 hitos, adems del origen y del destino. En las rutas de transporte pblico no se admiten hitos. Un objeto waypoint consta de los siguientes campos: location (obligatorio): especifica la direccin del hito. stopover (opcional): indica si el hito es una parada real en la ruta (true) o solo una preferencia que marca el deseo de pasar por la ubicacin especificada (false). El valor predeterminado de las paradas es true. De forma predeterminada, el servicio de rutas calcula una ruta que atraviese los hitos especificados en el orden indicado. Opcionalmente, puedes transmitir objetos optimizeWaypoints: true en el elemento DirectionsRequest para que el servicio de rutas reordene los hitos de forma ms eficaz para optimizar la ruta proporcionada. Esta optimizacin es el resultado de aplicar el Problema del viajante. Todos los hitos deben definirse como paradas para que el servicio de rutas optimice la ruta. Si el servicio de rutas optimiza el orden de los hitos de acuerdo a tus instrucciones, se devolver el nuevo orden en el campo optimized_waypoints_order del objeto DirectionsResult. En el ejemplo siguiente, se calculan diferentes rutas a travs de Estados Unidos que utilizan diversos puntos de partida, puntos de llegada e hitos. Para seleccionar varios hitos, pulsa la tecla Ctrl mientras haces clic en cada uno de los elementos de la lista. Ten en cuenta que inspeccionamos routes.start_address y routes.end_address para disponer del texto correspondiente a todos los puntos de partida y de llegada de la ruta. var directionsDisplay; var directionsService = new google.maps.DirectionsService(); var map; function initialize() { directionsDisplay = new google.maps.DirectionsRenderer(); var chicago = new google.maps.LatLng (41.850033, -87.6500523); var mapOptions = { zoom: 6, mapTypeId: google.maps.MapTypeId .ROADMAP, center: chicago } map = new google.maps.Map (document.getElementById("map_canvas"), mapOptions); directionsDisplay.setMap(map); } function calcRoute() { var start = document.getElementById("start").value; var end = document.getElementById("end").value; var waypts = []; var checkboxArray = document.getElementById("waypoints"); for ( var i = 0; i < checkboxArray.length; i++) {

https://developers.google.com/maps/documentation/javascript/directions

13/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
if (checkboxArray.options[i].selected == true) { waypts.push({ location:checkboxArray[i].value, stopover:true }); } } var request = { origin: start, destination: end , waypoints: waypts, optimizeWaypoints: true, travelMode: google.maps.TravelMode.DRIVING }; directionsService.route(request, function (response, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(response); var route = response.routes[0]; var summaryPanel = document.getElementById("directions_panel"); summaryPanel.innerHTML = ""; // For each route, display summary information. for ( var i = 0; i < route.legs.length; i++) { var routeSegment = i+1; summaryPanel.innerHTML += "<b>Route Segment: " + routeSegment + "</b><br />"; summaryPanel.innerHTML += route.legs[i].start_address + " to "; summaryPanel.innerHTML += route.legs[i].end_address + "<br />"; summaryPanel.innerHTML += route.legs[i].distance.text + "<br /><br />"; } } }); } Ver ejemplo (directions-waypoints.html)

Rutas arrastrables
Los usuarios pueden modificar las rutas para llegar en coche, a pie o en bicicleta que se muestran utilizando de forma dinmica un objeto DirectionsRenderer en caso de rutas arrastrables . Esto permite al usuario seleccionar y modificar rutas haciendo clic en ellas y arrastrndolas en el mapa. Puedes indicar si la visualizacin del procesador permite direcciones arrastrables estableciendo la propiedad draggable en true. Las rutas de transporte pblico no pueden ser arrastrables. Cuando las rutas son arrastrables, el usuario puede seleccionar cualquier punto de la ruta (o hito) del resultado devuelto y mover el componente indicado a una nueva ubicacin. El objeto DirectionsRenderer se actualizar de forma dinmica para mostrar la ruta modificada. Tras la publicacin, se aadir un hito de transicin al mapa (que se indicar con un pequeo marcador blanco). Si seleccionas y desplazas un fragmento de la ruta se modificar ese tramo de la misma, mientras que si seleccionas y mueves un marcador de hito (incluidos los puntos de inicio y fin) se modificar el tramo de la ruta que pase por ese hito. Debido a que las rutas arrastrables se modifican y se procesan en el lado del cliente, es posible que quieras controlar y gestionar el evento directions_changed en el objeto DirectionsRenderer para recibir una notificacin cuando el usuario modifique las rutas mostradas. El fragmento de cdigo que aparece a continuacin permite mostrar un recorrido de ida y vuelta desde Sdney hasta el interior de Nueva Gales del Sur (Australia). El cdigo realiza el seguimiento del evento directions_changed para actualizar la distancia total de todos los tramos del trayecto. var rendererOptions = { draggable: true }; var directionsDisplay = new google.maps.DirectionsRenderer(rendererOptions);; var directionsService = new google.maps.DirectionsService(); var map; var australia = new google.maps.LatLng (-25.274398, 133.775136); function initialize() {

https://developers.google.com/maps/documentation/javascript/directions

14/15

2/04/13

Servicio de rutas - Versin 3 del API de JavaScript de Google Maps Google Developers
var mapOptions = { zoom: 7, mapTypeId: google.maps.MapTypeId .ROADMAP, center: australia }; map = new google.maps.Map (document.getElementById("map_canvas"), mapOptions); directionsDisplay.setMap(map); directionsDisplay.setPanel(document.getElementById("directionsPanel")); google.maps.event .addListener(directionsDisplay, 'directions_changed', function () { computeTotalDistance(directionsDisplay.directions); }); calcRoute(); } function calcRoute() { var request = { origin: "Sydney, NSW", destination: "Sydney, NSW", waypoints:[{location: "Bourke, NSW"}, {location: "Broken Hill, NSW"}], travelMode: google.maps.TravelMode.DRIVING }; directionsService.route(request, function (response, status) { if (status == google.maps.DirectionsStatus.OK) { directionsDisplay.setDirections(response); } }); } function computeTotalDistance(result) { var total = 0; var myroute = result.routes[0]; for (i = 0; i < myroute.legs.length; i++) { total += myroute.legs[i].distance.value; } total = total / 1000. document.getElementById("total").innerHTML = total + " km"; } Ver ejemplo (directions-draggable.html)

Last updated enero 31, 2013.

Google

Condiciones de servicio

Poltica de privacidad

Empleo

espaol

Informar sobre un error

https://developers.google.com/maps/documentation/javascript/directions

15/15