Movilidad Web Offline

Visualización de mapas y gestión de tracks sin conexión y sin instalaciones

Fernando Lacunza - flacunza@itracasa.es
Garazi Lacunza - glacunza@itracasa.es
Tracasa Instrumental

Sumario

  1. Presentación
  2. Mapas offline
  3. Geolocalización y tracking
  4. Vídeo de demostración

Tracasa Instrumental

Escisión de Tracasa desde abril de 2016

Lleva a cabo encargos IT y GIS del Gobierno de Navarra

La propuesta

Una solución completamente web para gestionar rutas sin conexión a Internet

"Completamente web" quiere decir que solo necesita el navegador del dispositivo para funcionar

Creación de mapas offline

Solución basada en:

  1. Application Cache
  2. Servicios de mapas teselados (WMTS)

Application Cache

¿Qué es?

  • Standard para "instalar" aplicaciones web
  • Se define un manifiesto: lista de las direcciones de todos los recursos que usa la aplicación
<!DOCTYPE html>
<html manifest="manifest.appcache">
CACHE MANIFEST
CACHE:
https://geoweb.tracasa.es/idena/navegar/layout/idena/img/logo-alargado.gif
https://geoweb.tracasa.es/idena/navegar/layout/idena/img/logoIDENASinLeyenda.svg
https://sitna.tracasa.es/api/dev/TC/css/img/thumb-basemap.png
https://sitna.tracasa.es/api/dev/TC/css/img/thumb-orthophoto.jpg
...

Application Cache

¿Cómo funciona?
La primera vez que accedemos a una página cacheable se descargan todos los recursos del manifiesto
En sucesivos accesos, si el manifiesto no ha cambiado o no hay conexión a Internet se usan los recursos descargados
Si el manifiesto deja de existir, se borran los recursos del dispositivo

Application Cache

Problemas

Unos cuantos, pero en especial el siguiente:

La lista de recursos es única por página

Dificultad para la personalización

Servicios WMTS

El mapa consiste en un conjunto de mosaicos de imágenes pregeneradas

Dada un área de interés se puede saber qué imágenes necesitaremos

Como ejemplo resaltamos las teselas necesarias para visualizar África

Manifiesto dinámicamente generado

Manifiesto semilla + lista de teselas = mapa offline

Generador de mapas

Dos capas

Generador de mapas

Parte en cliente

Control de la API SITNA

  1. Comprueba qué mapas de fondo son WMTS y los muestra al usuario
  2. Consulta al usuario el área y los mapas de fondo a guardar
  3. Calcula qué teselas están implicadas
  4. Envía petición a la parte de servidor

Generador de mapas

Parte en servidor

  • DLL que se añade como plugin a un sitio ASP.net
  • Un handler replica la página original, pero añade un manifiesto al que le pasa los parámetros recibidos
    http://idena.navarra.es/navegar/ http://idena.navarra.es/navegar/offline 
    <!DOCTYPE html>
<html>
    		 
    <!DOCTYPE html>
<html manifest="manifest?W3sidXJs...">
  • El manifiesto es otro handler que calcula la lista de teselas en base a los parámetros

Borrado de mapas

  1. El cliente solicita la página del mapa enviando una cookie de borrado
  2. El handler que genera el manifiesto recibe la cookie y envía un código HTTP 410 (Recurso ya no existe)
  3. El navegador interpreta el código 410 y borra la cache de aplicación

Funcionalidades Tracking

geolocalización

Basada en el standard de geolocalización de HTML5

  • ubicación inicial a baja precisión
  • pronta respuesta
  • offline - GPS
  • online - IP / WIFI / GPS

seguimiento

activamos seguimiento de alta precisión

registro - persistencia offline

  1. sesión del navegador
  2. delegamos en localForage.js

lista de tracks

Creados + Importados (GPX/KML)

Demo online

https://sitna.tracasa.es/api/jornadasSIGLibre2016/demo/

gracias por vuestra atención

https://github.com/sitna

ruegos y preguntas