Por Federico LópezEsri Servicios Online
Esri Servicios Online
Si observamos nuestras calles, medios de comunicación, redes sociales, ... ¡ha llegado la noche de Halloween!. Y aunque no es una fiesta muy nuestra, poco a poco cada vez más gente se anima a celebrarla.
Con motivo de este día, desde el departamento de Servicios Online se nos ha ocurrido utilizar el potencial de ArcGIS Online para crear El Mapa de los Lugares más terroríficos de España.
No estamos seguros de haber despertado demasiado miedo, aunque tampoco era nuestra intención. El objetivo fundamental de esta iniciativa ha sido crear una aplicación interactiva e impactante y eso parece que sí lo hemos conseguido, ya que la reacción más común ante nuestro mapa ha sido de asombro, seguida de un... ¿cómo lo habéis hecho?.
Pues bien, vamos a explicaros los principales pasos que hemos dado para crear la aplicación:
1. Identificar el tipo de aplicación.
Como hemos visto en anteriores post, Esri, a través de sus Story Maps, pone a disposición de los usuarios plantillas para crear aplicaciones web, que combinan mapas inteligentes con textos, imágenes y otros contenidos multimedia que permiten mostrar de un modo muy didáctico una amplia variedad de temas.
Por eso hemos identificado entre las distintas plantillas disponibles, cuál sería la que mejor se adaptaba a nuestra idea de crear una ruta virtual por los lugares más terroríficos de España.
En este caso nos decantamos por la opción Storytelling Playlist, ya que partiendo de información puntual (en nuestro caso los emplazamientos) permite relacionar la información del mapa con una narración interactiva a modo de lista.
2. Crear el web map con la información.
Después de documentarnos acerca de cuales son los lugares terroríficos más famosos de nuestro país, plasmamos toda esta información en un fichero CSV, con un modelo de datos adaptado al que utiliza nuestra aplicación. Con él creamos este web map:
Ver mapa más grande
Como puede observarse, este mapa tiene una composición muy sencilla. Utilizando como base el mapa topográfico se ha incorporado nuestro CSV, a modo de capa puntual, y sobre ella se han configurado pop ups que incluyen una descripción del lugar y de lo que allí ha acontecido, además de una imagen.
3. Modificar la plantilla de la aplicación.
Ya teníamos nuestros datos en un mapa y la aplicación que queriamos utilizar descargada e instalada, así que sólo nos quedaba convertirla en nuestro "mapa del terror".
Para ello modificamos los ficheros de configuración de la aplicación del siguiente modo:
¿Cómo conseguir un mapa base terrorífico?
Si observamos nuestras calles, medios de comunicación, redes sociales, ... ¡ha llegado la noche de Halloween!. Y aunque no es una fiesta muy nuestra, poco a poco cada vez más gente se anima a celebrarla.
Con motivo de este día, desde el departamento de Servicios Online se nos ha ocurrido utilizar el potencial de ArcGIS Online para crear El Mapa de los Lugares más terroríficos de España.
No estamos seguros de haber despertado demasiado miedo, aunque tampoco era nuestra intención. El objetivo fundamental de esta iniciativa ha sido crear una aplicación interactiva e impactante y eso parece que sí lo hemos conseguido, ya que la reacción más común ante nuestro mapa ha sido de asombro, seguida de un... ¿cómo lo habéis hecho?.
Pues bien, vamos a explicaros los principales pasos que hemos dado para crear la aplicación:
1. Identificar el tipo de aplicación.
Como hemos visto en anteriores post, Esri, a través de sus Story Maps, pone a disposición de los usuarios plantillas para crear aplicaciones web, que combinan mapas inteligentes con textos, imágenes y otros contenidos multimedia que permiten mostrar de un modo muy didáctico una amplia variedad de temas.
Por eso hemos identificado entre las distintas plantillas disponibles, cuál sería la que mejor se adaptaba a nuestra idea de crear una ruta virtual por los lugares más terroríficos de España.
En este caso nos decantamos por la opción Storytelling Playlist, ya que partiendo de información puntual (en nuestro caso los emplazamientos) permite relacionar la información del mapa con una narración interactiva a modo de lista.
Importante
Todas las plantillas de los Story Maps pueden descargarse e instalarse directamente en tu servidor web para que puedas configurarlas y personalizarlas a tu gusto.
2. Crear el web map con la información.
Después de documentarnos acerca de cuales son los lugares terroríficos más famosos de nuestro país, plasmamos toda esta información en un fichero CSV, con un modelo de datos adaptado al que utiliza nuestra aplicación. Con él creamos este web map:
Ver mapa más grande
Como puede observarse, este mapa tiene una composición muy sencilla. Utilizando como base el mapa topográfico se ha incorporado nuestro CSV, a modo de capa puntual, y sobre ella se han configurado pop ups que incluyen una descripción del lugar y de lo que allí ha acontecido, además de una imagen.
3. Modificar la plantilla de la aplicación.
Ya teníamos nuestros datos en un mapa y la aplicación que queriamos utilizar descargada e instalada, así que sólo nos quedaba convertirla en nuestro "mapa del terror".
Para ello modificamos los ficheros de configuración de la aplicación del siguiente modo:
- Relacionamos la aplicación con el web map en el que se encontraban nuestros datos.
- Determinamos los textos descriptivos que queríamos incorporar.
- Personalizamos su apariencia: colores de fondo, fuente de los textos, banner superior, simbología, ...
¿Cómo conseguir un mapa base terrorífico?
Para dar ese toque de miedo a la aplicación necesitábamos un mapa de fondo oscuro que evocara la noche y resultara algo tenebroso.
La primera opción que se nos ocurrió fue preparar un mapa nuevo con colores oscuros, pero si servíamos el mapa de forma dinámica sería demasiado lento y no disponíamos de tiempo suficiente para cachearlo. ¿Qué opción nos quedaba? Una opción muy práctica para dar efectos al mapa y relativamente sencilla de llevar a la práctica con algo de conocimiento de desarrollo es la aplicación de filtros a las imágenes devueltas de los mapas cacheados.
Utilizamos como mapa base el Mapa Topográfico de Esri, que está cacheado a muchas escalas, pero en lugar de mostrar los tiles directamente, primero los procesamos en el cliente con JavaScript y modificamos cada imagen para obtener su inversa. La inversa de una imagen se obtiene calculando el color inverso de cada uno de los píxeles, que en el modelo de color RGB se determina restando del valor máximo (255 en nuestro caso) el valor del color original.
Tuvimos la suerte de que en el inverso del Mapa Topográfico, las zonas de tierra quedan con tonos morados y negros y las de agua con tonos rojizos, lo que da el aspecto terrorífico que buscábamos. Os animamos a que probéis esta técnica con la que se pueden aplicar todos los filtros que queráis a las imágenes, ¡simplemente hay que jugar con los valores de los píxeles!
