Diferencias

Muestra las diferencias entre dos versiones de la página.

--- personas:brolin:capacitacion_sig:eafit_2016 [2016/04/04 04:55] – [Objetivo] brolin
+++ personas:brolin:capacitacion_sig:eafit_2016 [2016/04/16 16:24] (actual) – [Procedimiento] brolin
@@ Línea 1: / Línea 1: @@
-====== ¿Cómo hacer accesibles los mapas históricos a la comunidad? ======
+====== Otras formas de acceder a los mapas históricos y compartirlos con la comunidad ======
-===== Objetivo =====
+En este documento se presenta una guía paso a paso para tomar un mapa histórico ya georreferenciado a través de www.mapwarper.net y crear un **sitio web independiente** con anotaciones sobre este.
-Una vez se han georreferenciado imágenes de mapas históricos ¿cómo podemos agregar información sobre ellas y compartir en formatos web?
+Se usan tres herramientas de libre acceso para este fin: mapwarper, geojson.io y quantum gis. Cada una cumple un propósito así:
-Cuando hacemos zoom sobre una imagen a través de una interfaz digital o scroll para acercanos a ella por carga en cuestión de segundos conservando la calidad. Las imágenes de alta calidad que estamos manejando pueden pesar cerca de 500MBs pero cuando las previsualizamos en mapwarper va cargando solo las porciones que el nivel de zoom determina, esto hace que sea más ágil cargar imágenes de buena resolución
-    - Formato especial Tiles((http://blog.thematicmapping.org/2013/06/showing-zoomify-images-with-leaflet.html))\\
+  * **Mapwarper **ya sabemos que nos ayuda a georreferenciar mapas históricos (o cualquier otro tipo de mapa) pero en este caso particular también se usa como la infraestructura en internet que sirve los mapas optimizados para esta tecnología. Es decir procesa las peticiones que le hace nuestro sitio web (el que vamos a crear) para servir las imágenes de la sección del mapa que estamos visualizando según el zoom y en la resolución óptima para no hacer muy lenta la carga de la página. Dicho de otra forma, corta la imagen original en alta resolución en pedacitos como se muestra en la siguiente figura y las envía de manera "inteligente" para que la carga se lo más rápido posible.  {{http://1.bp.blogspot.com/-qDoqInOLoVY/UcH7r94EqzI/AAAAAAAAK1I/NG98V_mymGY/s1600/deepzoom.png?500}} La idea importante que debe quedar acá es que **mapwarper** nos ahorra infraestructura que es costosa en términos de almacenamiento y ancho de banda para compartir nuestros mapas históricos. Cada mapa de buena resolución puede pesar 500M bytes que para descargar de internet en una buena conexión nos tardaría mínimo 10 minútos.
+  * **Geojson.io **nos permite ubicar puntos, áreas o polígonos como lo hacen los sistemas de información geográficos pero sin la necesidad de instalar software alguno. Lo hace a través de un sitio web y nos permite guardar nuestros datos en múltiples formatos. Para nuestro ejercicio, se cargan capas externas (el mapa histórico) sobre las cuales podemos ubicar características particulares.
-The tiling follows a quadtree or pyramid pattern of increasing resolution, doubling the resolution for each zoom level. The tile size is 256 x 256 px and there are 256 tiles in each folder. The filename for each tile is z-x-y.jpg where z is the zoom level and x/y is the grid position starting from the top left corner.
+  * **Quantum GIS o QGIS ** es un completo sistema de información geográfico que permite la manipulación de datos provenientes de múltiples fuentes, el análisis análisis de estos, la construcción de mapas para imprimir entre muchas otras funciones. Para este caso particular lo usaremos para crear el sitio web base donde integraremos el mapa histórico y las anotaciones sobre este que se hacen con geojson.io. Nos escribe el código de una página web con solo dar clic a un botón.
-{{http://1.bp.blogspot.com/-qDoqInOLoVY/UcH7r94EqzI/AAAAAAAAK1I/NG98V_mymGY/s1600/deepzoom.png?500}}
 ===== Procedimiento =====
-Mapwarper nos proporciona, una vez georreferenciada la imagen, varias maneras de exportar el mapaToma el enlace Tiles de mapwarper:
+Mapwarper nos proporciona, una vez georreferenciada la imagen, varias maneras de exportar el mapa:
   * Geotiff
@@ Línea 30: / Línea 26: @@
 Luego ingrese al sitio www.geojson.io, esta es una plataforma que nos permite crear de manera fácil y sin necesidad de instalar software alguno puntos, líneas o polígonos con información asociada. Podemos descargar o compartir el mapa creado para utilizar con otras herramientas.
-De clic en la opción de menú **Meta > Add map layer ** para agregar una capa externa en formato **Tile**. En el campo que aparece en pantalla pegue el enlace que acaba de copiar en **MapWarper** y a continuación escriba un nombre para esta capa
+De clic en la opción de menú **Meta > Add map layer ** para agregar una capa externa en formato **Tile**. En el campo que aparece en pantalla pegue el enlace que acaba de copiar en **MapWarper** y a continuación escriba un nombre para esta capa.
 {{:brolin:capacitacion_sig:geojsonaddlayer.png?800|}}
+En la parte inferior derecha puede ver una caja de chequeo junto al nombre que acaba de ingresar para la capa histórica.
 {{:brolin:capacitacion_sig:geojsoncapahistorica.png?800|}}
-  * Se marcan varios puntos en geojson.io
+Usando las herramientas en las parte derecha de geojson.io marque varios puntos. Puntos que representen elementos dentro del mapa histórico.
 {{:brolin:capacitacion_sig:geojsonubicarpunto.png?800|}}
+Agregue una columna a los puntos que ha ído marcando y asígnele un nombre. Luego puede empezar a ingresar la información para cada punto.
 {{:brolin:capacitacion_sig:geojsonagregarcolumna.png?800|}}
-  * Se descarga la información de geojson.io
+Cuando termines de agregar la información, vaya al menú **Save > GeoJSON**, asígnele una ubicación y un nombre donde guardarlo.
 {{:brolin:capacitacion_sig:geojsonguardar.png?800|}}
-  * Se abre qgis y se carga en qgis los datos bajados de geojson.io
+Abre el pograma QGIS, este es un sistema de información geográfico de escritorio completo y potente. Es desarrollado de manera abierta por una comunidad global que incluye instituciones y personas independientes.
+Cargue la capa que acaba de descargar de geojson.io y agréguela usando el botón con el ícono de nodos y el signo + blanco dentro de cuadrado verde ubicado en la parte superior izquierda. Selecciones el archivo y de clic en abrir, verá que objectos dentro del lienzo que antes estaba en blanco.
 {{:brolin:capacitacion_sig:qgiscargageojson.png?800|}}
-  * Se ajustan las propiedades, como los íconos para cada imagen
+A estos elementos que acabamos de agregar al lienzo les podemos podemos modificar su apariencia, vaya al menú ** capa > propiedades **  se desplegará un cuadro de diálogo con opciones como ** estilo, etiquetas, campos ** entre otras. Para nuestro ejercicio nos interesa el estilo, de click en este campo.
 {{:brolin:capacitacion_sig:qgispropiedadescapa.png?800|}}
+En este cuadro de díalogo podemos modificar las características de los marcadores (que corresponden a los objetos que creó en geojson), de click en el ícono **Airport** para acceder de manera fácil a asignarle una imagen a los objetos sobre nuestro mapa.
 {{:brolin:capacitacion_sig:qgisestilocapa.png?800|}}
-  * ¿Cómo cargar íconos?
+Tenga en cuenta las zonas marcadas en rojo de la siguiente imagen para explorar las posibilidades de íconos.
 {{:brolin:capacitacion_sig:qgisestilocapasvg.png?800|}}
-  * Se instala en qgis el complemento qgis2web
+Hasta este momento hemos hemos alterado la visualización de la información que agregamos sobre el mapa histórico usando geojson.io, pero ¿donde está nuestro mapa histórico? ... paciencia
+A continuación vamos a exportar para la web el mapa que estamos construyendo en QGIS. El resultado de este proceso se diferencia de usar geojson.io directamente en que obtendremos un mapa independiente que puede correr de manera local, desde nuestro computador, o se cargado a un sitio web diferente como la página de nuestro proyecto de investigación, los resultados de búsqueda del sitema de información de la biblioteca o una instalación interactiva!!
+Para lograr lo que describimos arriba, es necesario ingresar al administrador de complementos de QGIS e instalar el complemento **qgis2web**; escriba esta palabra en el campo **Buscar:**, seleccione el nombre del complemento en el cuadro de la parte izquierda y luego de clic en **Instalar complemento**. QGIS descargará automáticamente lo necesario desde internet.
 {{:brolin:capacitacion_sig:qgiscomplementoqgis2web.png?800|}}
+Una vez terminado el proceso de instalación puede acceder al complemento en el menú **Web > qgis2web > Create map**
 {{:brolin:capacitacion_sig:qgisabreqgis2web.png?800|}}
-  * Se exporta un .html con qgis2web usando dos mapas base
+Al darle clic a **Create map** se abrirá un completo cuadro de diálogo que lo asistirá en la creación de su mapa para web. Tenga en cuenta las opciones señaladas en rojo, sobre todo:
+  - **Export folder** Es directorio de su computador donde se guardará la carpeta que contiene el mapa.
+  - **Leaflet** Debe estar seleccionada esta opción para que funcione el procedimiento para agregar la capa histórica que describiremos en un momento.
+  - **Update preview** Al presionarlo nos permite ir viendo en la parte derecha como irá quedando nuestro mapa.
+  - **Cuadro de selección múltiple de la parte inferior derecha** Acá se seleccionan las capas base disponibles, es necesario seleccionar dos (ctrl + click) para luego reemplazar una por nuestra capa histórica
 {{:brolin:capacitacion_sig:qgiscomplementoqgis2webexport.png?800|}}
+Las demás opciones las puede dejar como se ve en la imagen. Al dar click en **Export** se creará el proyecto de manera local en su máquina en la ubicación que eligió para la opción **Export folder**, si no abré automáticamente el navegar con el mapa que usted acaba de crear, vaya a través del administrador de archivos al directorio que eligió para guardar el proyecto y de doble click al archivo **index.html**. Deberá ver algo como lo que se muestra a continuación.
 {{:brolin:capacitacion_sig:webmapa.png?800|}}
-  * Usar un editor de html, si es posible instalar atom.io
+¿Y mi mapa histórico? ... ya casi. Pero antes nos vamos adentrar en terrenos escabrosos, el código de el sitio que acabamos de crear. Es recomendable tener un editor de código instalado en su equipo, instale https://atom.io/
 {{:brolin:capacitacion_sig:atomide.png?800|}}
-  * Se reemplaza en el código .html uno de los mapas base con la dirección de tiles de mapwarper
+Una vez instalado atom, ejecútelo y a través del menú **archivo > abrir** abra el archivo **index.html** en la ubicación seleccionada antes.
+Para terminar es neceario modificar un par de líneas del código que vemos dentro del editor atom. La primera modificación es reemplazar una de las capas base seleccionadas a través del asistente de **qgis2web**. Cercano a la línea 80 en `var basemap1` reemplace la dirección entre comillas por el enlace Tiles que exportamos desde mapwarper. El mismo enlace que hace un rato agregamos a geojson.io. En la imagen es la primera línea resaltada con rojo. Guarde después de hacer esta modificación
 {{:brolin:capacitacion_sig:webmapaeditarcodigobasemap.png?800|}}
+La otra modificación se hace cerca a la línea del código 147, acá donde aparece **var baseMaps** se borra la palabra entre comillas simples que hay después de la coma, los dos puntos y la palabra basemap1. Debe quedar como se ve resaltado en la imagen.
+Y para terminar en la línea siguiente se agrega **, 'capa histórica` : basemap1** como se ve la otra sección resaltada de la imagen.
 {{:brolin:capacitacion_sig:webmapaeditaragregarcapa.png?800|}}
-  * Así se debería ver el sitio web final
+Así se debería ver el sitio web final
 {{:brolin:capacitacion_sig:webmapafinal.png?800|}}
-** Como lo ha venido haciendo la biblioteca nacional **
-¿Y si no hemos podido rectificar aún, cómo compartir la imagen con otras personas?
-  - Zoomify
-  - Open Sea Dragon