10 Visualización de mapas basados en la web

10.1 Objetivos

En este capítulo veremos:

  • Como usar RMarkdown para crear un sitio web.
  • Una revisión rápida de como producir visualizaciones con R y el paquete ggplot.
  • Como crear mapas interactivos usando el paquete leaflet.
  • Como publicar mapas interactivos usando RMarkdown para hacer un sitio web en GitHub.

10.2 Introducción

Compartir el trabajo científico de una manera interactiva y entretenida es fundamental para el avance de la ciencia. Hasta este punto del libro hemos hablado sobre las herramientas que nos ayudan a hacer ciencia abierta (open science):

  • R y muchos de sus paquetes
  • RStudio
  • git
  • GitHub
  • RMarkdown

RMarkdown es tremendamente potente para crear reportes científicos, sin embargo hasta ahora no hemos llegado ni a rozar en su verdadero potencial.

En esta lección, vamos a tomar un repositorio ya existente en GitHub y lo transformaremos en un sitio web elegante y simple de leer usando algunas de las herramientas que hemos aprendido hasta este punto.

10.3 Un ejemplo básico

  • En RStudio, cree un archivo nuevo al nivel tope se su repositorio git llamado index.Rmd. La forma más simple de hacer esto usando el menú de RStudio. Elija File -> New File -> RMarkdown… Esto abrirá una ventana de diálogo. Usted debe crear un “Document” en formato “HTML”. Esas son las opciones por defecto.

  • Abra index.Rmd (si es que no está y abierto).
  • Haga clic en Knit.
    • Vea la salida que se genera.
    • Note que se ha creado un nuevo archivo index.html en el mismo directorio. Este es el resultado transformado a código HTML (página web) a partir del documento RMarkdown.
  • Commit y push sus cambios (ambos archivos, index.Rmd e index.html).
  • Abra su navegador web en la página www.GitHub.com de su repositorio.
  • Vaya a Settings > GitHub Pages y active GitHub Pages para la rama (branch) master.

    Ahora la versión del sitio web de su repositorio se va a mostrar en un URL especial.

    GitHub Pages sigue la convensión:

    https://{username}.github.io/{repository}/
    https://cornejotux.github.io/claseRMarkdown/

    Ponga atención que ahora el sitio no está en github.com si no que en github.io.

  • Vaya a https://{username}.github.io/{repo_name}/ (Hay que poner el / al final!). Y vea la versión generada de su sitio web.

10.4 Un ejemplo ya no tan básico

Ahora que ha hemos visto como crear una página web desde RMarkdown, vamos a crear un sitio web que usa algunas de geniales funcionalidades que están disponibles en R. Vamos a seguir usando el mismo repositorio git y RStudio Project de arriba, pero vamos a agregar algunos archivos al repositorio y a modificar el documento index.Rmd.

Primero tenemos que obtener datos. Vamos a re-usar los datos sobre el retorno para desove de salmones de Alaska disponible desde la base de datos OceanAK del Departamento de Pesca y Casa de Alaska (ADF&G):

  • Navegue a Escapement Counts (o visite el sitio KNB y busque por ‘oceanak’) y copie el Download URL para el archivo ADFG_firstAttempt_reformatted.csv.
  • Descargue el archivo en R usando read.csv para hacer portable el código.
  • Calcule el escape anual (se refiere al número de peces que no son capturados por la pesquería) por especie y región usando el paquete dplyr.
  • Haga un gráfico de barras para el escape anual por especie usando el paquete ggplot2.
  • Muestre los datos en una tabla interactiva usando la función datatable disponible en el paquete DT.
  • Haga un mapa interactivo, tipo Google Maps, de los lugares donde se muestreó el escape de salmones.

Para hacer esto, vamos a usar el paquete leaflet que nos permite crear un mapa interactivo con marcadores en cada lugar de muestro:

Primero, cargamos todos los paquetes que vamos a usar:

10.4.1 Carga de datos: escape de salmones

Puede leer los datos en forma directa desde el repositorio de en KNB, si es que no lo tiene en su computador:

##        Location SASAP.Region sampleDate Species DailyCount  Method
## 1 Akalura Creek       Kodiak 1930-05-24 Sockeye          4 Unknown
## 2 Akalura Creek       Kodiak 1930-05-25 Sockeye         10 Unknown
## 3 Akalura Creek       Kodiak 1930-05-26 Sockeye          0 Unknown
## 4 Akalura Creek       Kodiak 1930-05-27 Sockeye          0 Unknown
## 5 Akalura Creek       Kodiak 1930-05-28 Sockeye          0 Unknown
## 6 Akalura Creek       Kodiak 1930-05-29 Sockeye          0 Unknown
##   Latitude Longitude Source
## 1  57.1641 -154.2287   ADFG
## 2  57.1641 -154.2287   ADFG
## 3  57.1641 -154.2287   ADFG
## 4  57.1641 -154.2287   ADFG
## 5  57.1641 -154.2287   ADFG
## 6  57.1641 -154.2287   ADFG

10.4.2 Gráficos estáticos

Ahora que ya tenemos los datos, calculemos el escape anual por especie y región:

## # A tibble: 6 x 4
## # Groups:   Species, SASAP.Region [1]
##   Species SASAP.Region                           Year escapement
##   <chr>   <chr>                                 <dbl>      <int>
## 1 Chinook Alaska Peninsula and Aleutian Islands  1974       1092
## 2 Chinook Alaska Peninsula and Aleutian Islands  1975       1917
## 3 Chinook Alaska Peninsula and Aleutian Islands  1976       3045
## 4 Chinook Alaska Peninsula and Aleutian Islands  1977       4844
## 5 Chinook Alaska Peninsula and Aleutian Islands  1978       3901
## 6 Chinook Alaska Peninsula and Aleutian Islands  1979      10463

Este fragmento de código usa varios de los comandos de dplyr que ya hemos visto y algunos otros nuevos. La función separate es usada para dividir la columna sampleDate en las columnas Year, Month y Day, las que luego usamos en group_by para indicar que queremos calcular nuestros resultados para las combinaciones únicas de species, region y year. A continuación usamos summarize para calcular los valores de escape para cada uno de estos grupos. Finalmente, usamos un filtro y el operador %in% para seleccionar sólo las especies de salmones.

Ahora vamos a hacer un gráficos con los resultados usando ggplot. ggplot usa estéticas de mapas (definidas usando aes()) y geometrías para crear el gráfico. Adicionalmente a geometrías/estéticas se pueden agregar a ggplot elementos de como temas para el formato gráfico y otros usando el operador +.

¿Qué pasa si queremos que las barras sean azules en vez de grises? Podríamos intentar hacer lo siguiente:

¿Qué pasó en este gráfico?

Vemos que al definir el color del gráfico dentro del llamado a la estética del mapa el color cambia, pero no es lo que queríamos hacer. Lo que ocurre, detrás de escena, es que se creó una columna llena con la palabra “blue” en el data.frame que usa ggplot y posteriormente fue mapeado a la estética fill, que finalmente seleccionó el color por defecto (rojo) para llenar las columnas.

Lo que queríamos hacer era cambiar el color de las barras. Para hacer esto debemos llamar la opción del color dentro de la función geom_bar fuera de la llamada a la función estética del mapa.

¿Y si ahora queremos mapear el color de la barras basado en una variable? por ejemplo región.,

ggplot es muy poderoso porque permite hacer fácilmente un gráfico que muestre estos aspectos de los datos.

Aquí hay un ejemplo con una estética y geometría de mapas diferente que podemos usar con estos datos. Se puede además agregar título, ajustar etiquetas e incluir un tema.

Fíjese que en el código anterior se agregó un filtro a la función ggplot, esto se hizo para graficar sólo los salmones en registrados para la isla Kodiak.

ggplot tiene la funcion facet_wrap que permite crear fácilmente gráficos como este para cada región usando, todos en una solo gráfica, con el mismo formato y características.

10.4.3 Mapas interactivos

Ahora vamos a convertir los datos de escape de salmones a una tabla donde exista una fila única para cada lugar de muestro:

Y la desplegamos en una tabla interactiva:

Con los datos en esta tabla hacermos un mapa usando leaflet que requiere (generalmente) sólo un par de lineas de código:

La función addTiles() obtiene la capa base desde OpenStreetMap que es una alternativa de código abierto a Google Maps. addMarkers usa una sintaxis un poco rara en comparación a la que acabamos de ver con ggplot2, usa ~ antes de los nombres de columnas. Esto es similar a como trabaja la función lm (y algunas otras) y es necesario que usted se asegure que incluye ~ para que su mapa funcione.

En leaflet también es posible usar capas desde Servicio de Mapas Web (Web Map Services o WMS). Aquí hay un ejemplo que utiliza una capa del mapa batimétrico general de los océanos (GEBCO) WMS. En este ejemplo además demostramos como usar marcadores más simples.

Leaflet tiene muchas funcionalidades que permiten crear mapas elegantes y funcionales con facilidad. Aquí hay ejemplos de mapas que fueron creados como parte del proyecto SASAP (Estado del Salmon de Alaska y Su Gente) usando las mismas herramientas que acabamos de aprender. Estos mapas le pueden dar una idea de cuan poderosa puede ser la combinación de RMarkdown y las páginas de GitHub.

10.5 Mapas estáticos con ggplot y geom_sf

También es posible crear mapas similares usando ggplot y la geometría geom_sf. Para hacer esto, lo primero que se debe hacer es transformar el data.frame con los datos de los lugares a un objeto sf entregando el sistema de coordenadas de referencia (EPSG:4326 es el sistema para geocoordenada en WGS84). También es necesario transformar los puntos a EPSG:3857 que es el sistema de coordenadas de referencia usado para hacer los mapas en Google Maps, Stamen y OpenStreetMap, entre otros.

Después, tomamos un mapa base desde una capa en Stamen map server que cubra la región de interés. Esto incluye una transformación del polígono del área en EPSSG:326 para dejarla en el mismo sistema de coordenadas EPSG:3857, que es la proyección que el mapa raster entregará desde Stamen.

Finalmente se grafica el mapa base raster con los puntos sobrepuestos, esto es fácil de hacer ahora que todo esta en la misma proyección (3857):