Insertar mapas

Información general

You can embed maps from multiple providers in your app to provide users with an easy way to reach your location. You can also configure a Navigate button to offer users directions on how to get from their location to a destination of your choice. For the purpose of this example, we will use Google Maps to embed maps into UiPath^® Apps.

Consejo:

Para obtener más información sobre cómo utilizar las API de búsqueda de Google Mapas , consulta la documentación oficial.

Insertar mapa

1. En Google Mapas, busque la dirección que desea compartir.

2. Haz clic en Compartir y ve a la pestaña Insertar un mapa .

   

3. Select the desired size and copy the link by selecting COPY HTML.

4. Ve a la aplicación deseada en ^UiPath® Apps.

5. Agrega un control IFrame .

6. Añade el enlace copiado en el paso 3 en el campo Origen del control. Elimina las etiquetas <iframe> y añade comillas. Por ejemplo, un enlace debería tener el siguiente aspecto:

"https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d1511.2061413255587!2d-73.9796223417571!3d40.75295602669006!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x89c2590199a4c12d%3A0x35c4d69dd805cc5e!2sOne%20Vanderbilt!5e0!3m2!1sen!2sro!4v1674472555170!5m2!1sen!2sro"

Nota: para insertar aplicaciones de forma dinámica, recomendamos usar la API de Google Mapas para insertar mapas. Para más información, consulta la documentación oficial.

Añadir botón de navegación

1. Ve a la aplicación deseada en ^UiPath® Apps.

2. Agregar un control Botón .

3. Cambia el nombre del botón a Navegar. También puedes añadir un icono adecuado al botón, como un coche.

4. Ve a la pestaña Eventos y edita la regla en el que se ha hecho clic.

5. Añade una regla URL abierta.

6. Añade la API de Direcciones de Google Mapas con el siguiente formato:

   "https://www.google.com/maps/dir/?api=1&destination=UiPath+New+York+USA".

Resultado

When previewing the app, the embedded interactive map and button are displayed. If you click Navigate, a new Google Maps page is opened. You can select your desired means of transportation and add your starting point, for instructions on how to get to the configured destination.