v0.20 — Edición 2026. Domina Folium v0.20 en este audiocurso de la edición 2026. Aprende a conectar el ecosistema de datos de Python con Leaflet.js para crear mapas web interactivos y potentes.
Análisis geoespacialMapas interactivosVisualización de datos
Descubre la abstracción principal de Folium: conectar el ecosistema de datos de Python con Leaflet.js. Aprende a inicializar un Map, establecer la ubicación inicial y renderizar tu primer mapa HTML interactivo.
3m 56s
2
Personalizando el lienzo
Aprende a transformar el estilo visual de tu mapa usando tilesets y bounds. Cubrimos xyzservices, map tiles personalizados y cómo restringir el desplazamiento del usuario.
3m 17s
3
Ubicando datos
Domina el arte de colocar chinchetas en tu mapa de Folium. Exploramos Markers, Icons personalizados y la diferencia crucial entre Tooltips y Popups.
4m 00s
4
Interactividad enriquecida en Popups
Lleva tus popups al siguiente nivel incrustando contenido enriquecido. Aprende a parsear HTML, incrustar DataFrames de Pandas, inyectar gráficos de Vega y optimizar con lazy loading.
4m 14s
5
Organizando vectores y capas
Dibuja rutas y agrupa tus datos para mantener los mapas limpios. Exploramos PolyLines, FeatureGroups y cómo dar el control a los usuarios con LayerControls.
3m 58s
6
Superposiciones espaciales con GeoJSON
Desbloquea funciones espaciales avanzadas importando GeoJSON a Folium. Aprende a mapear fronteras e integrarlas a la perfección con DataFrames de GeoPandas.
3m 53s
7
Distribuciones con Choropleths
Combina geografía con estadística usando mapas Choropleth. Aprende a vincular DataFrames de Pandas a regiones GeoJSON para visualizar distribuciones de datos.
4m 02s
8
Rendimiento y Plugins
Potencia tus mapas con los plugins de Folium. Descubre MarkerClusters para conjuntos de datos de puntos masivos, HeatMaps para densidad y herramientas Draw para interacciones en el mapa.
4m 10s
Episodios
1
El puente de Folium
3m 56s
Descubre la abstracción principal de Folium: conectar el ecosistema de datos de Python con Leaflet.js. Aprende a inicializar un Map, establecer la ubicación inicial y renderizar tu primer mapa HTML interactivo.
Hola, soy Alex de DEV STORIES DOT EU. Folium, episodio 1 de 8. Tienes un dataset enorme de coordenadas geográficas y necesitas un mapa interactivo para darles sentido. El problema es que crear mapas interactivos suele implicar salir de Python y pelearse con librerías de JavaScript. El puente de Folium es la solución exacta a ese dolor de cabeza.
Folium es una librería de Python que actúa como traductor entre tus workflows de datos y Leaflet punto js. Leaflet es una librería de JavaScript open-source muy popular, que se usa para crear mapas interactivos adaptados a móviles. Como data scientist, prefieres hacer el trabajo pesado, es decir, la manipulación, el filtrado y el análisis de datos, en Python. Folium te permite quedarte en ese entorno. Coge tus objetos de Python y genera el HTML y el JavaScript necesarios para renderizar un mapa de Leaflet. Consigues la interactividad de un mapa web sin escribir ni una sola línea de código frontend.
Empezar es muy sencillo. Instalas la librería usando gestores de paquetes estándar como pip, ejecutando pip install folium. Una vez instalada, el workflow principal gira en torno a crear un objeto map base. Imagina que estás evaluando posibles coordenadas para la ubicación de una nueva tienda. Tienes la latitud y la longitud exactas, y necesitas ver el barrio de alrededor.
En tu script, importas la librería folium. Luego, llamas a la función Map de esa librería. Esta función requiere un dato fundamental para ser útil desde el primer momento: el punto central de inicio. Le pasas este punto central usando el parámetro location. El parámetro location espera una simple lista o tupla que contenga dos números. La latitud va primero, seguida de la longitud. Por ejemplo, le pasas 45.52 para la latitud y menos 122.68 para la longitud. Al ejecutar esto, Folium construye un objeto map centrado exactamente en esas coordenadas.
Ahora tienes un objeto map en memoria. ¿Cómo lo ves realmente? Folium ofrece dos caminos principales, dependiendo de tu workspace. Si estás trabajando dentro de un Jupyter Notebook, el proceso es transparente. Simplemente escribes el nombre de tu objeto map en la última línea de la celda y la ejecutas. El entorno del notebook reconoce la representación HTML enriquecida del objeto y renderiza automáticamente el mapa interactivo de Leaflet justo debajo de tu celda de código. Puedes hacer pan y zoom de inmediato para inspeccionar esa posible ubicación de la tienda.
Sin embargo, a menudo necesitas compartir este mapa con stakeholders que no usan Jupyter. Aquí es donde entra en juego el segundo método. Coges tu objeto map y llamas a su método save. Le pasas un nombre de archivo como string a este método, por ejemplo, index punto html. Folium coge toda la lógica subyacente de Leaflet, las coordenadas y las instrucciones de renderizado, y las escribe en un archivo HTML independiente en tu disco duro. Cualquiera puede hacer doble clic en ese archivo y abrir un mapa interactivo totalmente funcional en su navegador web estándar. No hace falta ningún entorno de Python para ver el resultado final.
Aquí está la clave. Folium no renderiza mapas de forma nativa en Python; es simplemente un motor que genera el código web necesario para que un navegador los renderice. Actúa estrictamente como un puente hacia Leaflet, haciendo que tus datos de Python estén web-ready al instante.
Si estos episodios te están resultando útiles y quieres apoyar el programa, puedes buscar DevStoriesEU en Patreon; cualquier ayuda nos viene genial para seguir adelante. Eso es todo por este episodio. Gracias por escuchar, ¡y a seguir programando!
2
Personalizando el lienzo
3m 17s
Aprende a transformar el estilo visual de tu mapa usando tilesets y bounds. Cubrimos xyzservices, map tiles personalizados y cómo restringir el desplazamiento del usuario.
Hola, soy Alex de DEV STORIES DOT EU. Folium, episodio 2 de 8. Creas un mapa interactivo precioso de un parque nacional, pero en cuanto el usuario hace clic y arrastra, se sale de la costa y se pierde en un océano gris infinito. Necesitas las imágenes de fondo adecuadas y fijar la cámara exactamente donde están tus datos. De esto trata personalizar el canvas.
Al inicializar un mapa de Folium, por defecto usa los tiles estándar de OpenStreetMap. Son esos tiles de imágenes cuadradas que el navegador une para formar el fondo del mapa. Los mapas de calles estándar no siempre son la mejor opción. Puedes cambiar esto usando el parámetro tiles al crear tu mapa. Si quieres un fondo difuminado y minimalista para que tus datos destaquen, puedes pasarle un simple string como cartodb positron. Pero para un parque nacional, probablemente quieras imágenes de terreno o de satélite.
Aquí es donde Folium se integra con un package llamado xyzservices. No tienes que buscar enlaces a servidores de mapas de terceros. Folium incluye cientos de providers preconfigurados. Simplemente accedes al dictionary de providers desde el módulo map de Folium y eliges el que necesitas. Puedes elegir un mapa topográfico de Esri o un feed de satélite específico. Le pasas ese objeto provider directamente al parámetro tiles, y Folium gestiona las requests al servidor por detrás.
A veces, tu organización tiene un servidor de mapas privado, o necesitas un overlay muy especializado que no está en la lista por defecto. En ese caso, puedes pasarle un string con una URL custom al parámetro tiles. Los servidores de mapas usan una estructura de URL estandarizada que contiene placeholders para el nivel de zoom, normalmente representado por la Z, junto con las coordenadas X e Y del tile del mapa. Tú proporcionas esa plantilla de URL directamente. Aquí hay un requisito estricto. Al usar una URL custom, Folium te obliga a incluir un segundo parámetro llamado attr, que viene de attribution. Debes proporcionar un string dando crédito a la fuente de datos. Sin el parámetro attribution, Folium se negará a renderizar los tiles custom.
Ahora tu mapa tiene el fondo topográfico perfecto. Pero aún tienes el problema del panning. Los usuarios pueden hacer scroll y alejarse mucho del parque nacional. Esto lo evitas configurando los límites del viewport. Al crear el objeto map, defines un bounding box usando cuatro parámetros específicos: latitud mínima, latitud máxima, longitud mínima y longitud máxima. Le pasas los límites de las coordenadas de tu parque a estos parámetros.
Aquí está la clave. El simple hecho de definir esas cuatro coordenadas no impide que el usuario haga panning. Para bloquear activamente el viewport, también debes establecer el parámetro max bounds en true. Cuando habilitas esto, Folium le indica al mapping engine subyacente que devuelva la cámara a su sitio si el usuario intenta arrastrar la vista fuera del rectángulo que has especificado. Son libres de hacer zoom in y zoom out para explorar los senderos, pero el mapa les bloquea físicamente para que no se pierdan por el océano.
Establecer límites estrictos mantiene a tu audiencia centrada en la geografía relevante, y hacer coincidir esos límites con los tiles de terreno correctos le da a tus datos el contexto exacto que merecen. Eso es todo por este episodio. Gracias por escuchar, y ¡sigue creando!
3
Ubicando datos
4m 00s
Domina el arte de colocar chinchetas en tu mapa de Folium. Exploramos Markers, Icons personalizados y la diferencia crucial entre Tooltips y Popups.
Hola, soy Alex de DEV STORIES DOT EU. Folium, episodio 3 de 8. Un mapa es básicamente una imagen estática hasta que empiezas a ponerle pines para resaltar ubicaciones específicas. Pero no todos esos pines tienen que verse exactamente igual, como la típica gota azul por defecto. Señalar datos de forma efectiva significa dar a tus usuarios pistas visuales y contexto interactivo justo a nivel de coordenadas.
Para colocar un punto de interés en tu mapa, usas la clase folium punto Marker. El único requisito absoluto para crear un marker es el parámetro location. Le pasas una secuencia de dos números, primero la latitud, seguida de la longitud. Una vez que creas este objeto marker en tu código, lo adjuntas a tu mapa base usando el método add to. Eso te da un pin estándar situado exactamente en esas coordenadas.
Pero un pin básico solo le dice al usuario que algo existe ahí. Necesita comunicar qué es ese algo. Folium te da dos formas principales de adjuntar texto a un marker, y los developers las confunden constantemente. La distinción es simple. Un tooltip es texto en hover. Un popup es una etiqueta en click.
Piensa en un mapa que muestra diferentes estaciones de esquí en una cordillera. Quieres que el tooltip contenga el nombre de la estación, como Aspen o Snowbird. Esto le permite al usuario escanear rápidamente el mapa moviendo su cursor de pin a pin, viendo al instante cómo los nombres aparecen y desaparecen. El popup se reserva para información secundaria que requiere intención para leerla. Cuando el usuario hace click activamente en el pin de Aspen, el popup revela detalles como un desnivel de tres mil pies o las condiciones meteorológicas actuales. Usas el tooltip para una identificación rápida, y el popup para un contexto más profundo. Configuras ambos pasando texto a los parámetros tooltip y popup cuando creas tu marker.
Ahora bien, ver cincuenta pines azules idénticos es una mala experiencia de usuario. Puedes diferenciarlos visualmente usando la clase folium punto Icon. Cuando creas tu marker, puedes pasarle un objeto Icon personalizado a su parámetro icon. Esto te permite alterar el color del propio pin y el gráfico que se muestra en su interior.
Para el parámetro color, Folium acepta varios nombres de string estándar como red, green, purple u orange. Volviendo a nuestras estaciones de esquí, podrías categorizarlas visualmente marcando las estaciones para principiantes en verde, y las exclusivas para expertos en rojo.
Para cambiar el símbolo dentro del pin, usas el parámetro icon dentro de la clase Icon. Por defecto, Folium usa los glyphicons de Bootstrap. Puedes pasar nombres como cloud o info dash sign para obtener esos gráficos específicos dentro de tu marker. Si la librería por defecto no tiene el símbolo exacto que necesitas, puedes cambiar a los iconos de Font-Awesome. Haces esto configurando el parámetro prefix en tu objeto Icon con el string f a. Una vez que cambias el prefix, puedes pasar cualquier nombre estándar de Font-Awesome al parámetro icon. Esto te abre una librería masiva de símbolos, permitiéndote colocar un gráfico de copo de nieve en tus estaciones de invierno en lugar de una forma genérica.
Aquí está la clave. Los markers en tu mapa llevan la verdadera narrativa de tus datos espaciales. Combinar colores distintos, símbolos reconocibles y la división correcta entre texto en hover y acciones en click convierte una simple cuadrícula de coordenadas en una interfaz muy legible.
Gracias por escuchar. Cuidaos todos.
4
Interactividad enriquecida en Popups
4m 14s
Lleva tus popups al siguiente nivel incrustando contenido enriquecido. Aprende a parsear HTML, incrustar DataFrames de Pandas, inyectar gráficos de Vega y optimizar con lazy loading.
Hola, soy Alex de DEV STORIES DOT EU. Folium, episodio 4 de 8. Haces clic en un marcador en un mapa esperando un desglose detallado, pero en su lugar, obtienes un bloque de texto plano, apretado e ilegible. Quizás pienses que los pines de mapa solo sirven para etiquetas cortas. Pero en realidad puedes incrustar una tabla de datos interactiva completa o un minigráfico justo dentro de ese pin. Esto es lo que veremos hoy: Interactividad rica en popups.
Por defecto, los popups de Folium aceptan un simple string de texto. Pero están diseñados para manejar mucho más. Piensa en un mapa inmobiliario. Cuando un usuario hace clic en el pin de una casa, una dirección no es suficiente. Quieres mostrar una foto de la propiedad y una tabla limpia y formateada con las estadísticas de la vivienda. Esto lo consigues tratando el popup como una página web aislada.
Primero, puedes pasar strings de HTML raw directamente al popup. Al poner el argumento parse html a true, le indicas a Folium que renderice el string como elementos web estructurales en lugar de mostrar los corchetes angulares literales en la pantalla. Esto te permite incluir tags de imagen, headers y formato web estándar directamente dentro del marcador.
Para layouts más avanzados, usas un componente específico del framework subyacente de Folium llamado Branca IFrame. Un IFrame crea una ventana aislada y con scroll dentro del popup. Esto es crucial al incrustar estructuras complejas, ya que evita que los estilos internos del popup o las imágenes grandes se salgan y rompan el layout principal de tu mapa. Creas tu string HTML, se lo pasas al objeto IFrame, le pones un ancho y alto fijos, y luego pasas ese IFrame directamente a tu Popup.
Este flujo de trabajo encaja perfectamente con las librerías de análisis de datos. No necesitas construir manualmente tablas HTML para mostrar las métricas. Si tienes un DataFrame de Pandas que contiene las estadísticas de la propiedad, simplemente llamas al método estándar de Pandas to html. Coges ese string HTML generado, se lo pasas a tu IFrame, y el pin de tu mapa ahora contiene una tabla de datos precisa y totalmente formateada.
Puedes llevar esto más allá usando las clases Vega y VegaLite de Folium. Estas clases te permiten incrustar visualizaciones interactivas. En lugar de pasar HTML, le pasas una especificación JSON de un gráfico a la clase Vega, y la asignas directamente al popup. Ahora, al hacer clic en el pin de la casa, se muestra un gráfico de líneas dinámico con los valores históricos de la propiedad junto a la tabla de datos.
Aquí está la clave. Cargar todo este contenido rico crea un cuello de botella masivo en el rendimiento. Si tu mapa inmobiliario tiene cinco mil pines de casas, y cada popup contiene una tabla de datos, un enlace a una imagen y un gráfico de Vega, el navegador intentará renderizar las cinco mil estructuras ocultas en el momento en que se cargue el mapa. La página se congelará al instante.
Para solucionar esto, el objeto Popup acepta un parámetro llamado lazy. Al poner lazy a true, Folium no inyecta el contenido del popup en la página web inicialmente. El mapa renderiza los marcadores, pero el HTML pesado, los IFrames y los gráficos se ignoran por completo. El navegador solo obtiene y renderiza el contenido en el momento exacto en que el usuario hace clic en un pin específico. Esto difiere el coste computacional, lo que significa que un mapa con miles de popups interactivos y pesados cargará igual de rápido que un mapa con etiquetas de texto estándar.
El verdadero poder de un mapa web no está en dónde colocas los pines, sino en cuánto contexto puedes meter dentro de ellos sin degradar la experiencia del usuario. Gracias por escuchar. Cuidaos todos.
5
Organizando vectores y capas
3m 58s
Dibuja rutas y agrupa tus datos para mantener los mapas limpios. Exploramos PolyLines, FeatureGroups y cómo dar el control a los usuarios con LayerControls.
Hola, soy Alex de DEV STORIES DOT EU. Folium, episodio 5 de 8. Trazas cincuenta rutas de reparto y una docena de almacenes en un solo mapa. El resultado es una maraña caótica de líneas que se cruzan que nadie puede leer. Necesitas una forma de que los usuarios filtren el ruido. Ahí es donde entra en juego organizar los vectores y las capas.
Primero, necesitas dibujar las rutas. Para representar coordenadas conectadas en un mapa, usas la clase PolyLine de Folium. Un PolyLine recibe una secuencia de pares de latitud y longitud y dibuja segmentos rectos entre ellos. Si tienes las trazas GPS de un camión de reparto, simplemente le pasas esa lista de coordenadas al objeto PolyLine. Puedes configurar propiedades visuales como el color, el grosor y la opacidad. Esto te permite dibujar una línea azul gruesa para una ruta de envío principal y una línea gris fina para una ruta de reparto local.
Si añades un PolyLine directamente a tu mapa base, se queda visible permanentemente. Para un mapa logístico complejo, esto es un error.
Aquí está la clave. En lugar de añadir las formas directamente al objeto map, debes meterlas dentro de un FeatureGroup. Un FeatureGroup es un contenedor lógico. Agrupa elementos relacionados para que puedan gestionarse como una sola unidad.
En nuestro escenario de logística, empiezas creando dos FeatureGroups separados. Llamas al primero Rutas de reparto y al segundo Ubicaciones de almacenes. Luego, a medida que generas los elementos del mapa, cambias su destino. Cuando creas un PolyLine para la ruta de un camión, lo añades al grupo Rutas de reparto. Cuando creas un marker estándar para un edificio, lo añades al grupo Ubicaciones de almacenes. Una vez que todos tus elementos individuales están clasificados en sus respectivos contenedores, añades ambos FeatureGroups al objeto map principal.
En este punto, el mapa generado se ve idéntico a uno donde todo se hubiera volcado directamente en la capa base. El resultado visual no ha cambiado, pero la estructura de datos subyacente sí. Esta estructura es la que permite la interacción del usuario.
Para exponer esta estructura al usuario, instancias un LayerControl de Folium y lo añades al mapa. El LayerControl escanea el objeto map, encuentra todos los FeatureGroups que has añadido, y construye automáticamente un menú interactivo en la esquina superior de la pantalla.
Tus FeatureGroups se convierten en overlays que puedes activar y desactivar. El usuario verá un checkbox para Rutas de reparto y otro checkbox para Ubicaciones de almacenes. Si la pantalla está demasiado saturada, pueden desmarcar las rutas para inspeccionar solo las instalaciones.
El LayerControl separa los datos de tu mapa en dos categorías: base layers y overlays. Los base layers son los tiles subyacentes del mapa, como una vista de calles o una vista por satélite. Estos se presentan con radio buttons, porque solo un mapa base puede estar activo a la vez. Los overlays son los vectores y markers que has añadido mediante FeatureGroups. Estos usan checkboxes, permitiendo que múltiples conjuntos de datos se apilen unos sobre otros.
La regla más importante de la interactividad en mapas es que la interfaz de usuario solo puede manipular lo que tu estructura de datos define. Si añades cada línea y marker al mapa raíz, tu menú de LayerControl estará vacío y el usuario no controlará nada.
Eso es todo por este episodio. ¡Hasta la próxima!
6
Superposiciones espaciales con GeoJSON
3m 53s
Desbloquea funciones espaciales avanzadas importando GeoJSON a Folium. Aprende a mapear fronteras e integrarlas a la perfección con DataFrames de GeoPandas.
Hola, soy Alex de DEV STORIES DOT EU. Folium, episodio 6 de 8. Dibujar mil marcadores individuales en un mapa es sencillo. Pero, ¿qué ocurre cuando necesitas dibujar las fronteras exactas e irregulares de los cincuenta estados de Estados Unidos, o los sinuosos límites administrativos de una ciudad entera? Dibujar cada vértice a mano no es una opción. Los overlays espaciales con GeoJSON son la solución.
GeoJSON es el formato estándar de la industria para representar características geográficas complejas. Mientras que un marcador estándar representa una sola coordenada, GeoJSON maneja líneas, polígonos y multipolígonos. Cuando trabajas con fronteras del mundo real, trabajas con arrays que contienen miles de pares de latitud y longitud que definen una sola forma. Folium utiliza la clase GeoJson para coger estos datos densos de fronteras y renderizarlos como un overlay visual en tu mapa base.
Pongamos el escenario de mapear las fronteras de los distritos de una ciudad. Tienes los datos espaciales de veinte distritos y necesitas ver sus contornos en un mapa de calles. Algunos distritos son polígonos simples, mientras que otros pueden incluir islas o zonas desconectadas, lo que requiere multipolígonos. Folium te da varias formas de cargar estos datos complejos. Puedes pasar un string que contenga una URL que apunte directamente a un archivo GeoJSON alojado online. Puedes pasar una ruta de archivo local. Incluso puedes pasar un diccionario de Python parseado si ya has cargado los datos en memoria.
Aquí está la clave. Folium no solo lee archivos de texto estáticos. Se integra de forma nativa con todo el ecosistema de data science de Python. La clase GeoJson acepta cualquier objeto de Python que implemente la propiedad estándar geo-interface. Este es un protocolo común en las librerías espaciales de Python que permite que diferentes herramientas compartan estructuras de datos geográficos sin problemas.
Gracias a este estándar, no necesitas extraer manualmente los strings JSON si ya utilizas herramientas analíticas modernas. Puedes pasar un GeoDataFrame de GeoPandas directamente a Folium. Para ello, primero cargas los límites de tus distritos en un GeoDataFrame usando GeoPandas. A continuación, generas tu mapa base estándar centrado en la ciudad. Luego, llamas a la clase GeoJson y simplemente le pasas tu GeoDataFrame como argumento principal. Finalmente, añades ese objeto GeoJson recién creado a tu mapa base.
Folium lee la geo-interface del dataframe, extrae las formas geométricas de los veinte distritos de la ciudad y dibuja los límites exactos sobre los tiles del mapa. Evitas por completo la manipulación de archivos raw y pasas directamente de una estructura de datos a una visualización.
Ten en cuenta que este proceso de overlay específico se centra exclusivamente en mostrar límites espaciales. No se trata de unir datos estadísticos a esos límites para colorearlos según la población o los ingresos. Ese es un concepto completamente distinto. La clase GeoJson se encarga puramente de definir las formas físicas y ponerlas en el mapa.
La potencia de la capa GeoJSON de Folium no es solo que puede dibujar fronteras geográficas complejas y multiparte, sino que sirve como puente directo entre objetos analíticos como un GeoDataFrame y tu mapa interactivo final, sin requerir absolutamente ninguna manipulación manual de coordenadas.
Eso es todo por este episodio. Gracias por escuchar, ¡y seguid construyendo!
7
Distribuciones con Choropleths
4m 02s
Combina geografía con estadística usando mapas Choropleth. Aprende a vincular DataFrames de Pandas a regiones GeoJSON para visualizar distribuciones de datos.
Hola, soy Alex de DEV STORIES DOT EU. Folium, episodio 7 de 8. El mapa más reconocible en data science colorea regiones geográficas basándose en un valor estadístico. Conseguir que los bordes geográficos coincidan con los datos de tu hoja de cálculo normalmente requiere una operación de merge bastante liosa en una librería espacial aparte. En Folium, la clase Choropleth se encarga de la geometría, el data binding y la escala de color en un solo paso.
Un choropleth enlaza datos numéricos con límites geográficos. Tú pones las formas, tú pones los números, y el mapa colorea las formas basándose en esos números. Piensa en el clásico ejemplo de mapear la tasa de paro en los estados de Estados Unidos. Para montar esto, instancias la clase Choropleth y le pasas cuatro datos clave.
Primero, los datos geográficos. Le pasas un archivo GeoJSON que contiene los límites de los polígonos de los estados de Estados Unidos al parámetro geo data.
Segundo, los datos estadísticos. Le pasas tu DataFrame de Pandas con las estadísticas de paro al parámetro data.
Tercero, le dices a Folium qué partes de tu DataFrame importan. Le pasas una lista con exactamente dos nombres de columna al parámetro columns. La primera columna tiene el identificador de la región, como la abreviatura del estado. La segunda columna tiene el valor numérico que quieres visualizar, que es la tasa de paro.
Aquí está la clave. El DataFrame y las formas geográficas son objetos completamente separados. Tienes que decirle explícitamente a Folium cómo enlazarlos usando el parámetro key on. Este parámetro acepta un string que representa la ruta exacta dentro del archivo GeoJSON donde vive el identificador correspondiente. Si tu GeoJSON define un estado usando una feature property llamada id, tu parámetro key on será el string feature punto id. Esta ruta tiene que coincidir perfectamente con el identificador en la primera columna de tu DataFrame. Cuando coinciden, los datos estadísticos hacen bind con la geometría.
Una vez que los datos hacen bind, el mapa aplica los colores. El parámetro fill color acepta paletas estándar como YlGn para un degradado de amarillo a verde. Por defecto, Folium coge los valores mínimo y máximo de tu dataset y corta la escala de color en porciones matemáticas iguales. Si tus datos de paro están muy sesgados, este corte lineal podría agrupar a la mayoría de los estados en una sola banda de color, haciendo que el mapa no sirva para nada. Para controlar esto, pásale una lista de umbrales numéricos específicos al parámetro bins. Esto fuerza a la escala de color a cambiar exactamente donde tus datos se separan de forma natural, dándote control total sobre la distribución visual.
Los datasets del mundo real suelen tener huecos. Si a un estado en tu archivo de límites GeoJSON le falta una fila correspondiente en tu DataFrame, Folium dibujará el borde igual, pero dejará el interior sin colorear. Puedes gestionar estas regiones vacías con el parámetro nan fill color. Al configurarlo con un tono neutro como el gris, te aseguras de que los datos faltantes se marquen explícitamente sin distraer del resto del mapa.
La alineación entre la key del DataFrame y el property path del GeoJSON es el único punto de fallo para la mayoría de los choropleths. Si aciertas con el parámetro key on, el mapa se construye solo.
Si estos deep dives técnicos te resultan útiles, puedes apoyar el programa buscando DevStoriesEU en Patreon. Eso es todo por este episodio. Gracias por escuchar, ¡y sigue programando!
8
Rendimiento y Plugins
4m 10s
Potencia tus mapas con los plugins de Folium. Descubre MarkerClusters para conjuntos de datos de puntos masivos, HeatMaps para densidad y herramientas Draw para interacciones en el mapa.
Hola, soy Alex de DEV STORIES DOT EU. Folium, episodio 8 de 8. Dibujar cien puntos en un mapa web es fácil. Dibuja diez mil puntos y tu navegador se congelará por completo. El Document Object Model simplemente no puede manejar tantos elementos gráficos individuales a la vez. La solución a este cuello de botella es el rendimiento y los plugins.
Tienes un dataset de cien mil ubicaciones de recogida de taxis por toda la ciudad. Si haces un loop por esa lista y añades markers estándar directamente a tu base map, la página se colgará antes incluso de terminar de cargar. Aquí es donde entra en juego el plugin MarkerCluster. En lugar de añadir puntos directamente al mapa, creas un objeto cluster dedicado. Haces un loop por tu dataset, añades cada ubicación de recogida a este objeto cluster y, al final del todo, añades el cluster entero al mapa.
Cuando el mapa carga con el zoom al mínimo, el navegador no intenta dibujar cien mil pins. Dibuja unos cuantos círculos grandes con números dentro, que representan el recuento total de ubicaciones en esa zona amplia. A medida que haces zoom, esos clusters enormes se dividen dinámicamente en clusters más pequeños y localizados. Si haces clic en un círculo numerado, el mapa calcula automáticamente los límites y hace zoom en esa región específica. Maneja las matemáticas espaciales en background, asegurando que el navegador solo renderice los markers individuales cuando estás lo suficientemente cerca para verlos realmente.
A veces, las ubicaciones exactas de los puntos no son lo que realmente necesitas comunicar. Quieres ver la densidad. El plugin HeatMap coge esa misma lista enorme de coordenadas de taxis y renderiza un degradado de color suave en lugar de miles de pins superpuestos. Pasas tu lista raw de pares de latitud y longitud directamente a la función heatmap, y la añades al mapa. El plugin calcula la concentración espacial de tus datos. Las zonas de recogida de alta densidad brillan intensamente, mientras que las áreas más dispersas se desvanecen. Es computacionalmente mucho más barato para el navegador renderizar este único overlay que formas vectoriales discretas, y revela instantáneamente los hotspots sin convertir la pantalla en un caos de iconos.
Hasta este punto, los mapas han sido estrictamente read-only. El plugin Draw cambia ese comportamiento por completo. Añade una toolbar interactiva directamente a la interfaz de usuario. Activas el plugin en tu script de Python, y cuando el usuario abre el archivo resultante, puede hacer clic en las herramientas para dibujar polígonos personalizados, trazar líneas o soltar sus propios markers sobre tus datos de taxis.
Aquí está la clave. Estas formas dibujadas no son solo píxeles muertos en una pantalla. Generan datos espaciales válidos. Un usuario puede dibujar un límite alrededor de un barrio específico con alta demanda de taxis y exportar esa forma exacta como un archivo GeoJSON directamente desde la toolbar. Esto transforma tu visualización de un informe estático a una herramienta activa de selección y anotación.
Los plugins de Folium cierran la brecha entre los scripts de Python sencillos y el web mapping de frontend pesado, dándote un rendimiento avanzado en el navegador sin obligarte a escribir JavaScript. Te animo a explorar la documentación oficial, probar estas herramientas de forma práctica, o visitar devstories dot eu para sugerir temas de los que quieras oír hablar en una futura serie. Eso es todo por este episodio. ¡Gracias por escuchar, y sigue construyendo!
Tap to start playing
Browsers block autoplay
Share this episode
Episode
—
Copy this episode in another language:
Este sitio web no utiliza cookies. Nuestro proveedor de alojamiento puede registrar tu dirección IP con fines analíticos. Saber más.