Puntos de Interés (POI) con Realidad Aumentada en Wikitude

16-04-2014 - Andrés Cruz

Puntos de Interés (POI) con Realidad Aumentada en Wikitude In english

Este material forma parte de mi curso y libro completo; puedes adquirirlos desde el apartado de libros y/o cursos.

En este artículo veremos cómo marcar (mostrar los Drawables) un sitio a través de Puntos de Interés (POI); en otras palabras reconocer una zona por su posicionamiento geográfico a través de los llamados Puntos de Interés (POI) en vez de utilizar el Reconocimiento de Imágenes.

Pero, ¿qué es un POI o Punto de Interés?

Un POI no es más que una ubicación o punto en específico; básicamente es un lugar interesante un Punto de Interés catalogado por alguien; los mapas y GPS contienen muchos de estos puntos llamados POI.

Los POIs en Wikitude son manejados por una clase llamada GeoLocation, la cual representa una localización en la tierra en su espacio 3D; como podrás imaginarte, esta recibe tres parametros:

Parámetros de la clase GeoLocation

  • Latitude: Latitud de la localización dada en decimales.
  • Longitude: Longitud de la localización dada en decimales.
  • Altitude (optional): La altitud de la localización dada en metros.

El tercer componente hace posible ubicar un POI en el espacio 3D.

Ejemplo de la clase GeoLocation

var location3D = new AR.GeoLocation(47.77317, 13.069929, 320.0); // latitude, longitude, altitude
var location2D = new AR.GeoLocation(47.77317, 13.069929); // latitude, longitude

Ya sabemos como crear un Punto de Interés o POI en Wikitude, ahora debemos de crear el objeto Drawable para marcar el sitio; recordando los artículos pasados; esto no es más que el contenido que se desea mostrar cuando ocurra el reconocimiento ya sea mediante el Reconocimiento de Imágenes o por la localización (nuestro caso) a través de los POI:

htmlDrawable = new AR.HtmlDrawable({uri:"pagina.html"}, 1);

Ya tenemos el Punto de Interés POI y el contenido a mostrar. ¿Qué ente se encarga de localizar y analizar la zona en donde se encuentra el usuario y de esta forma mostrar los recursos establecidos en el Drawable (si y sólo si el usuario se encuentra dentro de un POI)?; en otras palabras; ¿cómo mostramos los Drawable según la posición del usuario?.

La clase GeoObject

Este clase permite especificar al menos un POI (objetos de la clase GeoLocation) o localización y los recursos Drawable a mostrar:

Parámetros de la clase GeoLocation

  • POI: Referencia al objeto GeoLocation.
  • Opciones (opcional): Otros parámetros para personalizar el objeto; permite definir qué es lo que se desea hacer luego de que el usuario esté dentro de un POI:
    • enabled: Booleano que indica si está o no activo el objeto GeoObject.
    • renderingOrder (por defecto 0): Número que define el orden de prioridad entre varios objetos de la clase GeoObject.
    • onEnterFieldOfVision: Función que se ejecuta cuando el usuario entra dentro de un POI.
    • onExitFieldOfVision: Función que se ejecuta cuando el usuario abandona un POI.
    • onClick: Función que se ejecuta al darle click (tocar la pantalla del dispositivo) a un objeto Drawable.
    • drawables.cam: Son objetos Drawables que se mostrarán en la pantalla del dispositivo.
    • drawables.radar: Radar para que el usuario ubique otros POI de interés cercanos a su posición:
Wikitude Radar
  • drawables.indicator: Son objetos Drawables (como una flecha) que se dibujan en el borde de la pantalla para visualizar la posición de otros objetos fuera de la cámara.

Ejemplo del objeto GeoLocation, Drawable y GeoObject

var location3D = new AR.GeoLocation(47.77317, 13.069929, 320.0); // latitude, longitude, altitude
//recurso Drawable
htmlDrawable = new AR.HtmlDrawable({uri:"pagina.html"}, 1);
//construimos el objeto GeoLocation
var geoObject  = new AR.GeoLocation(location3D,htmlDrawable); // POI -GeoLocation-, opciones

Resumen

Podemos resumir lo visto hasta el momento de la siguiente manera:

  • Definir el POI.
  • Definir el objeto Drawable o lo que nos interesa mostrar cuando el usuario esté ubicado en el POI.
  • El objeto que maneja los dos anteriores; localizar y analizar la zona en donde se encuentra el usuario y si esta coincide con el (los) POI(s) establecido(s) mostrar los recursos establecidos (Drawable). Viene siendo algo así como el Tracker en el Reconocimiento de Imágenes.

Conclusiones

El uso de los POI es algo que se agradece cuando otras tecnologías como el Reconocimiento de Imágenes falla o no se desea utilizar por diversos motivos; cuenta con mayor precisión que el Reconocimiento de Imágenes (ya que es Geográfico y no hay margen de error); sin embargo, podemos utilizar ambas tecnologías (POIs y Reconocimiento de Imágenes) de manera conjunta como veremos en próximos artículos.

Enlaces de Interés


Andrés Cruz
Desarrollo con Laravel, Django, Flask, CodeIgniter, HTML5, CSS3, MySQL, JavaScript, Vue, Android, iOS, Flutter

Andrés Cruz en Udemy

Acepto recibir anuncios de interes sobre este Blog.

Conozca nuestros cursos sobre Laravel, CodeIgniter, Flutter, Electron, Django, Flask y muchos más!

Ver los cursos
¡Hazte afiliado en Gumroad!

!Cursos desde!

4$

En Academia

Ver los cursos

!Libros desde!

1$

Ver los libros
!Web Alojada en Hostinger!