¿Sabías que puedes utilizar HTML en tu proyecto de Mergin Maps Maps para dar acceso a los usuarios sobre el terreno a información u otros documentos relacionados con tu encuesta? En este artículo, te mostraremos algunas formas de utilizar HTML para mejorar el flujo de trabajo de tu encuesta. Incluso puedes utilizar HTML sin conexión para enlazar con otros archivos almacenados en la carpeta del proyecto. Sigue leyendo para obtener más información.
Navegar hasta puntos con Google Maps
Uno de los mejores usos de HTML en su proyecto de Mergin Maps es utilizarlo para crear un enlace en el formulario del proyecto que, al hacer clic, abra la ubicación del punto en Google Maps. A continuación, el usuario puede optar por utilizar la función "Navegar" de Google Maps para encontrar indicaciones sobre cómo llegar al punto. Esto puede ser útil si los usuarios están tratando de navegar a diferentes puntos de la encuesta que están muy separados, o ayudarles a llegar al sitio de la encuesta.
Para crear el enlace de Google Maps en su formulario:
1. Abra las propiedades de la capa que contiene los puntos por los que navegan los usuarios.
2. Vaya a la pestaña "Gestionar campos" y haga clic en el botón Calculadora de campos.
3. Seleccione las opciones "Crear un nuevo campo" y "Crear campo virtual".
4. Asigne un nombre al campo y configure el "Tipo de campo de salida" como "Texto (cadena)".
5. Coloque el siguiente script HTML en el cuadro de expresión y sustituya los valores EPSG resaltados por los CRS de su proyecto:
'<a href="'||'https://www.google.co.uk/maps/place/' || to_string( y(transform( $geometry, 'EPSG:27700', 'EPSG:4326'))) || ',' || to_string( x( transform( $geometry, 'EPSG:27700', 'EPSG:4326'))) || '">Open Google Map</a>'
6. 6. Pulsa "OK
7. Vaya a la pestaña Form Builder y coloque el campo virtual en el diseño del formulario
8. Utilice las siguientes opciones para el widget de campo:
- Establezca el tipo de widget en Edición de texto
- Desactivar la edición
- Activar texto multilínea y HTML
- Haga clic en "Aceptar" en las propiedades de la capa y, a continuación, guarde y sincronice el proyecto.
Ahora, cuando los usuarios abran la función en el formulario de la encuesta, verán un enlace con "Abrir Google Maps" en el que pueden hacer clic y que abrirá Google Maps en su dispositivo, o lo abrirá en el navegador si no tienen Google Maps instalado, y podrán utilizar ese enlace para navegar hasta la ubicación.
Proporcionar más información a los encuestadores
En ocasiones, puede haber topógrafos sobre el terreno que necesiten identificar determinados tipos de elementos, como plantas, formaciones geológicas o especies animales. A los topógrafos puede resultarles útil acceder a información adicional que les ayude a contextualizar lo que están topografiando.
En este ejemplo de encuesta sobre el hábitat de las aves, le mostraremos cómo proporcionar al encuestador un enlace a más información sobre una especie de ave en función de la especie que haya seleccionado de una lista. El enlace cambiará a medida que el encuestador cambie la selección sin tener que guardar la entrada. Esto le permitirá consultar la información para confirmar su selección antes de pulsar el botón "Guardar" y le ayudará a reducir los errores en la encuesta.
Preparar los datos
En primer lugar, tenemos que asegurarnos de que tenemos los datos configurados en nuestra encuesta para que la función de enlace funcione. Necesitaremos una tabla de búsqueda con las especies de aves que aparecerán en la encuesta, junto con un enlace a más información sobre cada especie. En nuestro ejemplo, tenemos una simple tabla CSV con los siguientes campos:
- id: un campo entero con un número de identificación para cada fila
- especies: un campo de texto con el nombre común de cada especie de ave
- enlace: un campo con un enlace a una página del sitio web de la RSPB sobre la especie
He aquí un ejemplo de los datos de la tabla:
En nuestra capa de encuesta, tenemos un campo de texto de especie correspondiente que tiene la siguiente configuración:
- Tipo de widget: Relación de valores
- Capa: especies (es la capa de nuestra tabla de consulta)
- Columna clave: nombre
- Columna de valor: nombre
Configurar el campo virtual
Ahora que tenemos nuestras tablas de capas configuradas, crearemos un campo virtual en la capa de la encuesta para el enlace externo. Siga exactamente los mismos pasos para crear el campo virtual que en el ejemplo anterior, pero dele a este campo un nombre diferente y utilice la siguiente expresión para crear el campo:
'<a href="'||attribute(get_feature('species','name',"species"),'link')||'">Species Information</a>'
Ahora sólo tiene que añadir el campo virtual al diseño de su formulario y el usuario podrá hacer clic en el enlace "Información sobre la especie" del formulario para ver más información sobre la especie seleccionada en ese momento.
Abrir documentos almacenados en la carpeta del proyecto
También puede utilizar HTML para abrir documentos PDF o de otro tipo que estén almacenados en la carpeta del proyecto. Esto también puede funcionar sin conexión de datos, ya que los archivos se almacenan en el directorio del proyecto y luego se descargarán en el dispositivo del usuario. Para enlazar con cualquier archivo del directorio del proyecto, puede utilizar enlaces relativos como valor por defecto para un campo de texto con HTML activado utilizando la siguiente expresión:
project://<path_to_file_within_project>
Utilicemos nuestro ejemplo anterior del estudio de aves para que los encuestadores puedan acceder a la información sobre las aves cuando trabajen sin conexión.
Para configurar los documentos en el proyecto:
1. Cree una carpeta en el directorio del proyecto para los PDF, utilizaremos '/species' en nuestro proyecto de ejemplo.
2. Asegúrese de que los nombres de los archivos PDF coinciden con las entradas de la columna "nombre" de la tabla de búsqueda de especies.
3. Configure un campo virtual con la misma configuración que antes, utilizando el nombre "offline_id" y la siguiente expresión:
'<a href="'||'project://species/' || "species" || '.pdf">Offline Info</a>'
4. Añade el campo virtual 'offline_id' al diseño del formulario
Ahora el usuario puede acceder a los datos sin conexión almacenados en el proyecto haciendo clic en el enlace "Información sin conexión" y se abrirá el PDF correspondiente.
Seguir aprendiendo
Si este tutorial te ha resultado útil, también puedes consultar nuestra documentación para descubrir otros usos de HTML en tu proyecto de encuesta, como personalizar el panel de vista previa y proporcionar instrucciones o consejos a los usuarios sobre el terreno. Gracias por utilizar Mergin Maps y asegúrate de estar atento a futuros artículos con consejos y buenas prácticas.