Advertisement

SIG en dispositivos móviles - GEOwebinar UNIGIS

Servei de SIG i Teledetecció (SIGTE), Universitat de Girona
Jun. 18, 2014
Advertisement

More Related Content

Advertisement
Advertisement

SIG en dispositivos móviles - GEOwebinar UNIGIS

  1. SIG en dispositivos móviles Alexandre Busquets, programador analista SIG. SIGTE - Universitat de Girona
  2. SIG SIG: visualizar y gestionar datos geográficos SIG de escritorio: QGis gvSIG ArcGIS Librerías para SIG WEB (mobile support) OpenLayers LeaFlet
  3. Objetivos Mapa como punto central de la aplicación Gestión y visualización "in situ" de los datos geográficos y alfanuméricos Consulta de datos Edición de cartografía Edición de datos alfanuméricos Online / Offline Seguridad
  4. Funcionalidades Login Mapa Herramientas de navegación – Zoom – Desplazamiento – Posición de Inicio – Localización GPS Herramientas de información Información/identificación Medición
  5. Funcionalidades Datos y leyenda – Gestor de capas (Toc) • Capas • Mapa base – Leyenda Herramientas de edición – Crear objeto – Modificar objeto
  6. Componentes Modo online App móvil Servidor de Mapas API REST o WFS-T Servidor mapas externo
  7. Componentes Mapa base – Servidor de mapas (WMS) del SIG – Servidor de mapas externo (IGN, ICC,..) – API • Google Maps • Bing Maps Edición de datos – API REST – WFS-T Puntos a tener en cuenta: – Autentificación – Validaciones – Imágenes y archivos
  8. Componentes Modo Offline App móvil API Base datos Mapa Sincronización
  9. Componentes Mapa base – Tiles • Directorio local • Mbtiles – Canvas Edición de datos – Plugin persistencia Sistema de sincronización
  10. Solución tecnológica Apache Cordova + HTML5, CSS3 y Javascript Solución híbrida Apache Cordova Framework gratuito y open source HTML5, CSS3 y Javascript Aplicaciones móviles multiplataforma: iOS, Android, Windows Phone,... Conjunto de APIs que permiten controlar características como el acelerómetro, la cámara, las notificaciones, la geolocalización,...
  11. Solución tecnológica Ventajas vs aplicación nativa: – Entorno WEB. Ecosistema muy popular – Código Javascript de proyectos consolidados – Versión para distintos OS Ventajas vs publicación en web: – Aplicación empaquetada – Api para usar elementos del sistema (Notificaciones, LocalStorage, Cámara,...)
  12. Librerías Interfaz de usuario – JqueryMobile – Backbone – FastClick – OpenLayers Servidor API REST – php, python, nodejs Base de datos – Postgres+postgis – Oracle Spatial
  13. Librerías Servidor de mapas, servicios OGC (WMS, WFS) – Geoserver Base de datos offline – Spatialite
  14. Valoraciones Resultado final bueno Rendimiento inferior a aplicación nativa Algunos problemas Rendimiento del componente navegador (WebView) Problemas aceleración GPU para SVG y CSS en OL Las transiciones entre pantallas lentas cuando hay un mapa
  15. Preguntas?

Editor's Notes

  1. Hola a todos, En la siguiente xarla veremos un caso real de desarrollo de aplicación web para móviles. La aplicación que expondré se trata de "Parques de y Jardines de Figueres". La aplicación si bien está muy terminada aún se encuentra en fase de desarrollo.
  2. Login Existen 2 roles de usuario: Lectura Lectura/escriptura Mapa Mapa punto central de la aplicación. Herramientas de navegación: Zoom (evento touch con dos dedos a la vez.) Separa o unir dos dedos Desplazamiento (evento touch), movemos el dedo por la pantalla. Posición de Inicio. Posición GPS. Herramientas de información: Información/identificación. Medición. Datos y leyenda: Toc (Fuentes de datos) Capas Tapa base Capas de soporte a la edición Leyenda Herramientas de edición Crear objeto (Fotografia) Modificar objeto (Espai verd)
  3. Login Existen 2 roles de usuario: Lectura Lectura/escriptura Mapa Mapa punto central de la aplicación. Herramientas de navegación: Zoom (evento touch con dos dedos a la vez.) Separa o unir dos dedos Desplazamiento (evento touch), movemos el dedo por la pantalla. Posición de Inicio. Posición GPS. Herramientas de información: Información/identificación. Medición. Datos y leyenda: Toc (Fuentes de datos) Capas Tapa base Capas de soporte a la edición Leyenda Herramientas de edición Crear objeto (Fotografia) Modificar objeto (Espai verd)
  4. Además, podemos incluir código nativo.
  5. JqueryMobile (bàsicamente para la tematización) requirejs Para tener nuestor código ordenado y separado en varios archivos. Correspondientes a Backbone Nos ha permitido implementar el patron modelo-vista -control y tener todo organizado en classes Backbone-Forms Para crear los formualrios a partir de la definición de una clase Openlayers 2.13.1 FastClick (delay de 300 m cuando hacemos click)
  6. JqueryMobile (bàsicamente para la tematización) requirejs Para tener nuestor código ordenado y separado en varios archivos. Correspondientes a Backbone Nos ha permitido implementar el patron modelo-vista -control y tener todo organizado en classes Backbone-Forms Para crear los formualrios a partir de la definición de una clase Openlayers 2.13.1 FastClick (delay de 300 m cuando hacemos click)
Advertisement