Sesion 4
Juvenal Campos
1/18/2020
Capìtulo 4. Visualización de Datos Interactiva.
4.1 Definición de Visualización de Datos Interactiva.
El objetivo de la visualización de datos consiste en mostrar la naturaleza de los mismos, facilitando su comprensión, exploración y análisis. Nos permite hallar la existencia o inexistencia de patrones de comportamiento entre dos o más variables, poder realizar comparaciones entre sujetos de interés, encontrar valores extremos, y presentar información de manera gráfica.
La visualización estática consiste en presentar la información de manera plana, donde la información que se desea enseñar está presente de manera gráfica. Este formato es ideal para formatos físicos impresos o para presentar la informaciòn en redes sociales en formatos de imágen.
La visualización interactiva es la que permite al usuario realizar ciertas funciones de interacción con la representación gráfica de los datos. En palabras de Ben Shneiderman, estas funciones deben ser principalmente: vista general, zoom y selección.
Este tipo de visualizaciones se crean principalmente para los navegadores web, los cuales transforman código fuente escrito en HTML, CSS y/o JavaScript.
Para lograr dicho cometido, se cuenta con los navegadores web, los cuales transforman ( renderean ) código en una gráfica que se incorpora a una página web. (Veremos esto más adelante).
Referencias: http://informatica.blogs.uoc.edu/2017/06/01/la-visualizacion-interactiva-de-datos-como-herramienta-de-analisis/
4.2 Librerias para hacer visualización de Datos Interactiva.
htmlwidgets, para hacer visualizaciones dinámicas.plotly, para visualización de datos con funciones de zoom ytooltips.Highcharter, para visualizaciones dinámicas.DT, para visualizar tablas con filtros y funcionalidades.leaflet, para hacer mapas interactivos y sencillos.ggplot2, para visualización de datos como imágenes.networkD3, para visualizar datos de redes.
Entre otras.
NOTA 1. ¿Es necesario saber usar shiny para utilizar las visualizaciones dinámicas?
R: No. No es necesario, de hecho, se pueden utilizar también en conjunto con la libreria rmarkdown, obteniendo resultados muy profesionales y poderosos para, por ejemplo, publicar una entrada de blog o un reporte donde quieres dar ciertas funcionalidades al usuario.
PONER UNA ENTRY BLOG
Igualmente, se recomienda su uso para la exploración de bases de datos, debido a que en ciertas ocasiones el tener acceso a tooltips o a zoom puede revelarnos detalles que se escapan de las capacidades de la visualización estática.
CHECAR COMO QUE!
4.3 Visualizaciones con ggplot2.
Iniciaremos primero haciendo una visualización de datos con la libreria ggplot2, la cual es la librería del tidyverse para realizar visualizaciones de datos. Esta libreria utiliza la grammar of graphics, la cual nos permite programar visualizaciones de manera ordenada y coherente.
Para visualizar las gráficas en ggplot hay que tener en cuenta los elementos estéticos (canales de forma y posición) así como elementos gráficos como los temas (fondos, colores) y las etiquetas. Estos elementos se unen con el operador +, el cual se utiliza para unir capas de información y de esta manera, ir conformando la gráfica.
# Paso 1. Librerias.
library(ggplot2)
# Abrimos base de datos
#lluvia <- readRDS("lluviaTacubayaSMN.rds")
data("diamonds")
diamonds <- diamonds[sample(1:nrow(diamonds))[1:1000],]
# Hacemos la visualización
# (Primero visualizamos y luego guardamos en el objeto).
plot <- ggplot(data = diamonds, aes(x = carat, y = price, color = cut)) +
geom_point() +
labs(title = "Relationship entre carat and precio",
caption = "Datos de @juvenalCamposF"
) +
theme_classic()
# Checamos el tipo de objeto
class(plot)## [1] "gg" "ggplot"# Imprimimos
plot
4.3 Visualizaciones con plotly.
Aprender a hacer visualizaciones estáticas con ggplot es una habilidad básica y de gran utilidad (muchos medios de comunicación de de datos han sobrevivido sólo sabiendo ggplot() 😈). Sin embargo, ¿no hay una forma de que, con una sola función y sin necesidad de aprender nada más, pudieramos hacer que las gráficas de ggplot se hicieran interactivas?
Pues sí, y esta función es plotly::ggplotly(), y hay que pasarle como argumentos un objeto ggplot (justo como el que tenemos arriba).
# Cargamos la libreria plotly
pacman::p_load(plotly)
# Aplicamos la función.
ggplotly(plot)Y ahora si, tenemos una gráfica de dispersión interactiva.
NOTA. Sobre la instalación.
Muchas veces ha pasado que esta función no funciona (principalmente en computadoras Mac) despues de instalar la librería plotly. El problema puede deberse a que falta un driver dentro de la computadora que hay que instalar previo a utilizar estas funciones de la librería (El programa XQuartz o las librerías Cairo y Bitmap)
NOTA. Sobre la compatibilidad de gráficas con plotly.
No todas las gráficas que se realizan en ggplot pueden traducirse a gráficas plotly de esta manera tan sencilla. Las que típicamente no dan problemas son las gráficas de barras (geom_bar, geom_col, geom_histogram), las de líneas (geom_line) y las de puntos (geom_point), así como las de bigotes (geom_box). Las que típicamente dan problemas son las de pastel y los treemaps, pero como veremos a continuación, hay librerías más adecuadas para estos tipos de gráficas.
NOTA. Sobre plotly.
plotly es una librería de código abierto para realizar gráficas interactivas de manera sencilla, siendo la primera librería que hay que aprender a usar para adentrarnos en este tipo de gráficas. Hay versión de plotly tanto para python como para R, así como para JavaScript. En la página https://plot.ly pueden consultar guías y tutoriales de como construir otro tipo de gráficas de forma nativa (sin usar antes ggplot).
Igualmente, en el libro https://plotly-r.com pueden checar como realizar aplicaciones shiny solo utilizando esta librería.
4.4 Visualizando información geográfica con leaflet.
La librería leaflet es una librería open-source para mapas interactivos. Tiene las capacidades de generación de mapas que la mayoría de los desarrolladores necesitan, como zoom, pop-ups, tooltips, inclusión de imágenes georreferenciadas como fondo, exportación a archivos HTML, etc.
Esta es la librería que utilizamos en la primera sesión para realizar mapas. La siguiente práctica implica un repaso para reforzar conocimientos.
Primero: Leemos la información.
# Librerias
mapa <- readRDS("PueblaResultadosPAN.rds")
# Exploramos los datos
# head(mapa)La base de datos nos muestra los porcentajes de votación obtenidos a nivel municipal por Enrique Cárdenas (Candidato de la Coalición " Por Puebla al Frente ") en las elecciones extraordinarias de Puebla del 2019. Para esta práctica, vamos a hacer un mapa de la variable catPctje, la cual nos ilustra el porcentaje de votos del total municipal que obtuvo el candidato Enrique Cárdenas dentro de los municipios de Puebla.
Segundo: Hacemos el pop-up.
El pop-up es la ventana que nos saldrá cuando presionemos un objeto geográfico dentro del leaflet (en este caso, un polígono municipal), mostrandonos información. Este pop-up se construye como formato de texto, de forma vectorizada para cada elemento de la columna que se utilice, y estará redactado en formato HTML.
NOTA: Introducción al formato HTML.
| Tag | tag | Significado |
|---|---|---|
| Texto | b | Lo pone en negritas |
| Texto | em | Pone el texto en cursivas |
| a b |
br | Da un Quiebre a la oración |
Con estas funciones, ya podemos darle formato a nuestros popups.
options(scipen = 999)
# Creamos el popup
popup <- paste0("<b>Municipio: </b>", mapa$MUNICIPIO, "<br>",
"<b>Lista Nominal: </b>",format(mapa$ListaNominal, big.mark = ","), "<br>",
"<b>Total de Votos: </b>",mapa$Total_Votos, "<br>",
"<b>Votos PAN: </b>",mapa$ECS, "<br>",
"<b>Votos PRI: </b>",mapa$AJM,"<br>",
"<b>Votos Morena: </b>",mapa$LMGBH)Tercero: Ahora, creamos la paleta de colores.
Para generar una paleta de colores, necesitamos asociar un elemento de la variable dominio (la variable a partir de la cual vamos a colorear nuestros polígonos del mapa) con un color de una paleta preprogramada, como las de la librería RColorBrewer o viridis (o cualquier otra).
Para esto, leaflet tiene funciones generadoras de paletas, tales como:
colorNumeric()
colorNumeric(palette, domain, na.color = "#808080", alpha = FALSE, reverse = FALSE)
Esta funcion nos permite crear paletas de colores para variables o atributos que tengan valores numericos. Nos generara igualmente una escala de colores continua.
colorBin()
colorBin(palette, domain, bins = 7, pretty = TRUE, na.color = "#808080", alpha = FALSE, reverse = FALSE)
Esta funcion nos ayuda para crear paletas de colores donde automaticamente separa los valores de la variable numerica en rangos o bins (botecitos), generando una escala con valores discretos, en vez de continuos como hacia la funcion previa.
colorQuantile()
colorQuantile(palette, domain, n = 4, probs = seq(0, 1, length.out = n + 1), na.color = "#808080", alpha = FALSE, reverse = FALSE)
Esta funcion nos permite crear paletas de colores donde podemos separar la informacion en los cuantiles que especifiquemos previamente. Sirve para ver quienes se ubican en las partes inferiores y superiores de una escala numerica y de esta manera emitir juicios sobre la informacion.
colorFactor()
colorFactor(palette, domain, levels = NULL, ordered = FALSE, na.color = "#808080", alpha = FALSE, reverse = FALSE)
Esta funcion crea paletas de colores mediante el uso de variables categoricas (factors en R), donde asigna un color diferente a cada categoria de informacion.
# Revisamos las paletas de colores de RColor Brewer
RColorBrewer::display.brewer.all()
Paletas viridis: 
Otras paletas: Paletas wespalletes, basadas en las películas de Wes Anderson (El que hizo la de Isla de Perros).
https://github.com/karthik/wesanderson
El argumento reverse = FALSE nos dice que el color debe empezar en el orden original propuesto por la programación de la paleta de colores.
# Cargamos la liberia
pacman::p_load(leaflet)
# Creación de la paleta de colores:
pal <- colorFactor(palette = "Blues", # Porque #PAN
domain = mapa$catPctje,
reverse = FALSE
)Cuarto: Ahora, creamos el mapa.
Ahora que tenemos los polígonos y también tenemos la paleta de colores, necesitamos incluir (o no, depende de nuestro gusto y diseño) un fondo o tile. Para seleccionar esto, podemos visitar la página siguiente:
https://leaflet-extras.github.io/leaflet-providers/preview/
Para explorar las diferentes tiles que podemos incluir en nuestros mapas. Para este mapa, yo sugiero utilizar la capa CartoDB.Positron, la cual provee colores más grises y claros, permitiendo un contraste con la información resaltada por nuestra paleta de colores.
# Creacion del mapa.
leaflet(mapa) %>%
addProviderTiles("CartoDB.Positron") %>%
addPolygons(fillColor = pal(mapa$catPctje),
color = "black",
popup = popup,
label = paste0("Municipio: ", mapa$MUNICIPIO),
fillOpacity = 1,
weight = 0.6) %>%
addLegend(title = "Aportación de los municipios <br>al total de votos obtenidos <br>por Enrique Cárdenas (Coalición <br>PAN-PRD-MC) en la elección <br>Extraordinaria a Gobernador de <br>Puebla (MX) en 2019",
pal = pal, values = mapa$catPctje,
position = "bottomright")