Integra Google Maps en tu App

Hola!

En este tutorial vamos a ver cómo integrar Google Maps en nuestra aplicación. Esta funcionalidad nos sirve para poner un botón en nuestra App que lance automáticamente la App de Google Maps con una dirección predeterminada.

El tutorial se divide en dos pasos:

Paso 1. Obtener la dirección en Google Maps

Paso 2. Crear el botón en InDesign

Paso 1

Abrimos Google Maps en nuestro navegador y buscamos el lugar que nos interesa. Veremos que en la parte de abajo nos aparecen las coordenadas. maps_tutorial

En este ejemplo las coordenadas son: 40.417047,-3.703805

Una vez tengamos las coordenadas, podemos crear nuestra dirección con esta URL:

externalhttp://maps.google.com/maps?saddr=&daddr=

Al añadir nuestras coordenadas queda así:

externalhttp://maps.google.com/maps?saddr=&daddr=40.417047,-3.703805

Y por último, a esta URL le añadimos un pequeño código para establecer cómo queremos que Google Maps calcule la ruta:

En coche
A pie
Transporte público
Bici

&dirflg=d = for Driving directions (this is the default mode. leaving it out is the same as putting it in explicityly).
&dirflg=w = for Walking directions
&dirflg=r = for Public transit.
&dirflg=b = for Biking directions

En este ejemplo vamos a añadir en coche, así que pondremos al final de nuestra URL el código “&dirflg=d”. La URL final quedará así:

externalhttp://maps.google.com/maps?saddr=&daddr=40.417047, -3.703805&dirflg=d

Paso 2

1. En tu proyecto de Adobe InDesign crea un botón (a partir de un marco rectangular o una imagen, como prefieras)

2. Añade la acción “Ir a URL” que ya hemos visto en este tutorial 

3. En el campo “URL” pega la url que hemos creado en el paso 1:

externalhttp://maps.google.com/maps?saddr=&daddr=40.417047, -3.703805&dirflg=d

Ejemplo: maps

Listo! Ya lo tenemos configurado.

Cuando un usuario de la App pulse ese botón, le abrirá automáticamente la App de Google Maps con una ruta en coche desde su ubicación actual hasta el destino que nosotros hayamos elegido.

Si el usuario no tiene la App de Google Maps, abrirá su navegador por defecto del dispositivo y verá la versión web de Google Maps.

Hasta pronto!

 

Ir al Foro