100 Días de Código en Python — Día 73: Visualización con Matplotlib — la popularidad de los lenguajes de programación

📝 Contenido original del curso#

El lenguaje más antiguo todavía en uso es FORTRAN (1957). Desde entonces han aparecido muchos más, pero ¿cuál es el más popular, "del que todo el mundo habla"? Stack Overflow ayudará: cada pregunta lleva etiquetas (tags), y una puede ser el nombre de un lenguaje. Basta con contar cuántas publicaciones tiene cada etiqueta: gana el que tenga más.

Aprenderás a visualizar datos con Matplotlib; a pivotar, agrupar y transformar datos con pandas; a trabajar con fechas y series de tiempo; y a dar estilo a un gráfico de líneas.

Prerequisitos: exploración y groupby con pandas (Día 72), módulo datetime (Día 32), bucles for.

📝 Contenido original del curso#

Descarga el cuaderno de inicio (ya trae las secciones y retos), súbelo a Google Drive y ábrelo con Colab; agrega QueryResults.csv.

Reto (repaso del Día 72):

• Leer el CSV en un DataFrame df con los nombres de columna ['DATE', 'TAG', 'POSTS'] (revisa la documentación de read_csv()).
• Ver las primeras y últimas 5 filas.
• ¿Cuántas filas y columnas?
• Contar las entradas de cada columna.

Solución:

df = pd.read_csv('QueryResults.csv', names=['DATE', 'TAG', 'POSTS'], header=0)
df.head()
df.tail()
df.shape      # (1991, 3)
df.count()    # cuenta los valores que NO son NaN en cada columna

header=0 indica que la primera fila del archivo es un encabezado, que se reemplaza por nuestros nombres.

📖 Resultados verificados#

      DATE                  TAG         POSTS
0     2008-07-01 00:00:00   c#            3
1     2008-08-01 00:00:00   assembly      8
...
1990  2020-07-01 00:00:00   swift      3607
df.shape → (1991, 3)      df.count() → 1991 en las tres columnas

El formato es "largo": cada fila es un par (mes, lenguaje). Julio de 2008 solo tiene C#: Stack Overflow abrió ese mes.

📝 Ejercicio original del curso#

Reto: ¿cuántas publicaciones tiene cada lenguaje? ¿Cuál tuvo más desde la creación de Stack Overflow? Y como algunos lenguajes son más nuevos (Swift) que otros (C), ¿cuántos meses de publicaciones hay por lenguaje?

Solución: agrupar por TAG; .sum() da el total de publicaciones; .count(), los meses con datos.

📖 Explicación conceptual (verificada)#

🛠️ Nota técnica (verificado): con pandas 3, df.groupby('TAG').sum() no falla, pero "suma" también la columna DATE, que en este momento es texto: el resultado es una cadena gigantesca con todas las fechas pegadas. Es mejor seleccionar la columna que interesa:

12

df.groupby('TAG')['POSTS'].sum().sort_values(ascending=False)
df.groupby('TAG')['DATE'].count()

Resultados verificados:

Go y Swift tienen menos meses porque nacieron después (Go en 2009, Swift en 2014): el conteo de meses refleja la edad del lenguaje en el sitio.

🎯 Objetivo de aprendizaje#

Convertir una columna de fechas en texto a fechas reales de pandas.

📝 Contenido original del curso#

df['DATE'][1]     # notación de corchetes
df.DATE[1]        # notación de punto (solo si el nombre no tiene espacios; permite autocompletar)

El contenido es un texto ('2008-08-01 00:00:00'), no una fecha: muestra el innecesario 00:00:00 y no tiene las ventajas de los objetos de fecha. pd.to_datetime() lo convierte:

pd.to_datetime(df.DATE[1])           # una celda
df.DATE = pd.to_datetime(df.DATE)    # toda la columna

📖 Explicación conceptual (verificada)#

Después de convertir, df.DATE.dtype es datetime64 y las fechas van de 2008-07-01 a 2020-07-01. Con fechas reales puedes:

• ordenarlas correctamente (como texto, "2010-10" y "2010-9" se ordenan mal);
• extraer partes: df.DATE.dt.year, df.DATE.dt.month;
• filtrar: df[df.DATE >= "2015-01-01"];
• y Matplotlib las ubica bien en el eje del tiempo.

💡 Puedes convertir desde la lectura: pd.read_csv('QueryResults.csv', names=[...], header=0, parse_dates=['DATE']).

🎯 Objetivo de aprendizaje#

Pasar datos de formato largo a formato ancho con pivot() y manejar los NaN que aparecen.

📝 Contenido original del curso#

.pivot() convierte cada categoría en una columna. Ejemplo:

test_df = pd.DataFrame({'Age': ['Young', 'Young', 'Young', 'Young', 'Old', 'Old', 'Old', 'Old'],
                        'Actor': ['Jack', 'Arnold', 'Keanu', 'Sylvester', 'Jack', 'Arnold', 'Keanu', 'Sylvester'],
                        'Power': [100, 80, 25, 50, 99, 75, 5, 30]})
pivoted_df = test_df.pivot(index='Age', columns='Actor', values='Power')

• index: las categorías de las filas.
• columns: las categorías de las columnas.
• values: lo que va en las celdas.

Si falta un valor (por ejemplo, si no existiera el dato de Sylvester viejo), pivot() pone NaN.

Mini reto: pivotar df para que cada fila sea una fecha y cada columna un lenguaje (reshaped_df); ver dimensiones, primeras y últimas filas, nombres de columnas y conteo por columna.

reshaped_df = df.pivot(index='DATE', columns='TAG', values='POSTS')

Resultado: 145 filas y 14 columnas. El conteo por columna no es igual en todas porque .count() excluye los NaN, que aparecen donde un lenguaje no tuvo publicaciones ese mes (por ejemplo, Swift en julio de 2008). Aquí no conviene borrar esas filas, sino reemplazar NaN por 0:

reshaped_df.fillna(0, inplace=True)       # o: reshaped_df = reshaped_df.fillna(0)
reshaped_df.isna().values.any()           # False: no queda ningún NaN

.values.any() evita revisar a ojo toda la tabla: devuelve un solo True o False.

📖 Resultados verificados#

test_df pivotado:
Actor  Arnold  Jack  Keanu  Sylvester
Age
Old        75    99      5         30
Young      80   100     25         50

reshaped_df.shape → (145, 14)
Columnas: assembly, c, c#, c++, delphi, go, java, javascript, perl, php, python, r, ruby, swift
Conteos antes de fillna: go 129, swift 135, r 142, c# 145, el resto 144
Después de fillna(0): reshaped_df.isna().values.any() → False

💡 En el ejemplo de los actores no falta ningún valor (verificado: la tabla está completa). Para ver el NaN del que habla el curso, borra la fila de Sylvester viejo antes de pivotar (Reto 1).

🛠️ Nota técnica: con pandas 3 (modelo Copy-on-Write), inplace=True sigue funcionando sobre el propio DataFrame, pero la documentación recomienda la forma con asignación (reshaped_df = reshaped_df.fillna(0)), que es más clara y funciona igual en todos los casos. Nunca uses inplace=True sobre una columna seleccionada (df['col'].fillna(0, inplace=True)): en pandas 3 no modifica el DataFrame original.

¿Rellenar con 0 es correcto? Aquí sí: si no hay filas para Swift en 2008 es porque hubo cero publicaciones. Pero en otros datos, un NaN puede significar "no se midió", y rellenarlo con 0 sería inventar un dato.

⚠️ Errores frecuentes#

Retos adicionales (creados para esta adaptación)#

• 🟢 Reto 1 — Aplicación: borra la fila de Sylvester viejo de test_df, pivota y observa el NaN.
• 🟡 Reto 2 — Ampliación: pivota al revés: filas = lenguajes, columnas = años (pista: crea antes una columna YEAR con df.DATE.dt.year y usa pivot_table con aggfunc='sum').
• 🟠 Reto 3 — Desafío: usa reshaped_df.melt() para volver del formato ancho al largo y comprueba que recuperas las filas originales (¿cuántas filas más aparecen y por qué?).
• 🔴 Reto 4 — Pensamiento computacional: ¿en qué mes cada lenguaje tuvo su máximo de publicaciones? Constrúyelo con idxmax() sobre reshaped_df y ordénalo por fecha. ¿Qué te dice sobre la "vida" de cada lenguaje?

🎯 Objetivo de aprendizaje#

Dibujar un gráfico de líneas de una serie de tiempo y darle estilo.

📝 Contenido original del curso#

Matplotlib es una biblioteca de gráficos muy popular que funciona muy bien con pandas:

import matplotlib.pyplot as plt

Mini reto: un gráfico de líneas de la popularidad de Java en una línea de código:

plt.plot(reshaped_df.index, reshaped_df.java)        # x = fechas, y = publicaciones
plt.plot(reshaped_df.index, reshaped_df['java'])     # igual, con corchetes

Estilo:

Al agrandar el gráfico hay que agrandar también las fuentes para que se sigan leyendo.

Reto: Java y Python en el mismo gráfico.

📖 Explicación conceptual (adaptación)#

plt.figure(figsize=(16, 10))
plt.xticks(fontsize=14)
plt.yticks(fontsize=14)
plt.xlabel('Fecha', fontsize=14)
plt.ylabel('Número de publicaciones', fontsize=14)
plt.ylim(0, 35000)
plt.plot(reshaped_df.index, reshaped_df['java'])
plt.title('Publicaciones mensuales sobre Java en Stack Overflow', fontsize=16)
plt.show()

• plt.figure(...) debe ir antes de plt.plot(...): crea el lienzo.
• plt.title no aparece en la lección, pero todo gráfico debe decir qué muestra.
• plt.show() es necesario fuera de los cuadernos (en un .py). Para guardarlo como imagen: plt.savefig('java.png', dpi=150, bbox_inches='tight').
• reshaped_df.java funciona, pero reshaped_df.c# o reshaped_df.c++ no (el # y el + no son válidos en esa notación): para esas columnas, siempre corchetes.

📝 Contenido original del curso#

Dos líneas: basta con llamar plt.plot() dos veces. Todas: un bucle for sobre las columnas. Para saber cuál es cuál, una etiqueta por línea y una leyenda; y líneas más gruesas:

plt.figure(figsize=(16, 10))
plt.xticks(fontsize=14)
plt.yticks(fontsize=14)
plt.xlabel('Date', fontsize=14)
plt.ylabel('Number of Posts', fontsize=14)
plt.ylim(0, 35000)

for column in reshaped_df.columns:
    plt.plot(reshaped_df.index, reshaped_df[column],
             linewidth=3, label=reshaped_df[column].name)

plt.legend(fontsize=16)

"Parece que Python es el lenguaje más popular, a juzgar por las publicaciones en Stack Overflow. ¡Python gana!".

Suavizar la serie: las series de tiempo tienen mucho "ruido" (subidas y bajadas). La media móvil promedia una "ventana" de observaciones (por ejemplo, 6 o 12) y la desplaza de una en una:

roll_df = reshaped_df.rolling(window=6).mean()
# ... el mismo gráfico, dibujando roll_df en lugar de reshaped_df

Prueba con window=3 o window=12.

Resumen del día: groupby, to_datetime, pivot, count() y isna().values.any(), fillna, plot con un bucle, estilo del gráfico, leyenda y rolling().mean().

📖 Explicación conceptual (verificada)#

La media móvil, paso a paso: con window=6, el valor de junio es el promedio de enero a junio; el de julio, el de febrero a julio, y así. Por eso las primeras 5 filas quedan en NaN (verificado): no hay 6 meses anteriores para promediar. Una ventana más grande da una línea más suave, pero reacciona más tarde a los cambios reales.

Un gráfico de 14 líneas es difícil de leer (el propio curso lo nota al agregar la leyenda). Matplotlib repite colores después de 10 líneas, y las personas con daltonismo no distinguen varias de ellas (Día 65). Mejores opciones: mostrar solo los 4 o 5 lenguajes que interesan, usar estilos de línea distintos (linestyle='--') o hacer un gráfico por lenguaje (small multiples, Reto 4).

Retos adicionales (creados para esta adaptación)#

• 🟢 Reto 1: grafica solo Python, Java, JavaScript y C# con la media móvil de 12 meses y un título en español.
• 🟡 Reto 2: agrega una línea vertical en junio de 2014, cuando Apple presentó Swift (plt.axvline(pd.Timestamp('2014-06-01'), linestyle='--')), y una anotación con plt.annotate.
• 🟠 Reto 3: grafica la participación porcentual de cada lenguaje por mes (publicaciones de un lenguaje ÷ total del mes × 100). ¿Cambia la conclusión respecto a los números absolutos?
• 🔴 Reto 4 — Pensamiento computacional: con plt.subplots(nrows=4, ncols=4) dibuja un gráfico pequeño por lenguaje, con el mismo eje y. ¿Es más fácil o más difícil de leer que el gráfico con 14 líneas? ¿Por qué?

Problema#

Un grupo que va a empezar a programar quiere saber qué lenguajes son más populares y cómo ha cambiado eso con el tiempo.

Objetivo#

Un cuaderno que transforme QueryResults.csv y presente gráficos claros y conclusiones matizadas.

Requisitos funcionales#

1. Carga con nombres de columnas y fechas convertidas.
2. Totales y meses por lenguaje con groupby sobre las columnas correctas.
3. reshaped_df pivotado y sin NaN.
4. Un gráfico de Java y Python; un gráfico con todos los lenguajes y leyenda; uno suavizado.
5. Todos los gráficos con título, ejes rotulados y unidades.
6. Una celda de texto con conclusiones que distingan total acumulado y tendencia reciente, y al menos dos limitaciones.

Restricciones técnicas#

• Columnas con símbolos (c#, c++) con corchetes.
• El cuaderno funciona con Reiniciar y ejecutar todo.
• Gráficos guardados como PNG para el informe.

Planificación#

1. Comprender la pregunta. 2. Entradas: el CSV. 3. Procesos: cargar → convertir fechas → agrupar → pivotar → rellenar → graficar → suavizar. 4. Salidas: tablas, gráficos y conclusiones. 5. Una sección por lección. 6. Bocetar en papel los gráficos. 7. Implementar. 8. Comparar con los resultados verificados. 9. Corregir. 10. Redactar.

Construcción paso a paso#

• Versión 1: exploración y groupby.
• Versión 2: fechas y pivote.
• Versión 3: primer gráfico con estilo.
• Versión 4: todas las líneas y leyenda.
• Versión final: media móvil y conclusiones.

Pruebas#

🧪 Prueba y depuración#

df = pd.read_csv('QueryResults.csv', names=['DATE', 'TAG', 'POSTS'])
reshaped_df = df.pivot(index='DATE', columns='TAG', values='POSTS')
reshaped_df.fillna(0)
plt.plot(reshaped_df.index, reshaped_df.c#)
plt.figure(figsize=(16, 10))

Encuentra cuatro problemas: sin header=0, la fila de encabezados del archivo se lee como un dato; fillna(0) sin guardar el resultado; reshaped_df.c# es un error de sintaxis (el # inicia un comentario); y plt.figure va después de plt.plot, así que crea un lienzo nuevo y vacío.

⭐ Extensión del proyecto#

• Consultar datos más recientes en el Stack Exchange Data Explorer (con su consulta SQL) y comparar con 2020.
• Agregar al análisis un lenguaje que no esté (por ejemplo, TypeScript o Kotlin).

Situación#

Coordinación de convivencia quiere saber si la inasistencia de los estudiantes tiene patrones: ¿aumenta en ciertos meses?, ¿es igual en todos los grados?

Requisitos#

1. Un CSV en formato largo con FECHA, GRADO (6.° a 11.°) e INASISTENCIAS (número de estudiantes ausentes ese día). Si no hay datos reales anonimizados y autorizados, genera datos simulados con random (y dilo claramente en el informe).
2. Convierte las fechas, agrega por semana o por mes (lo verás a fondo el Día 75; por ahora, df.FECHA.dt.to_period('M')), y pivota: filas = mes, columnas = grado.
3. Gráfico de líneas por grado con leyenda, y la versión suavizada.
4. Conclusiones: ¿qué mes tiene más inasistencia?, ¿qué grado?, ¿qué podría explicarlo? (Vacaciones, temporada de lluvias, época de exámenes.)

Decisiones que debes tomar (y justificar)#

• ¿Por qué trabajar con totales por grado y no con estudiantes individuales?
• ¿Qué ventana de media móvil tiene sentido para datos diarios de colegio?

Casos de prueba#

• La suma de la tabla pivotada es igual a la suma de la columna original.
• El gráfico tiene título, ejes, unidades y leyenda.

Conceptuales#

1. ¿Qué hace header=0 junto con names=[...] en read_csv?
2. ¿Qué diferencia hay entre formato "largo" y formato "ancho"? ¿Qué método los convierte?
3. ¿Por qué aparecen NaN al pivotar y por qué aquí es correcto rellenarlos con 0?
4. ¿Qué es una media móvil y por qué las primeras filas quedan en NaN?
5. ¿Por qué "Python gana" depende de la medida elegida?

Análisis de código#

reshaped_df.sum().sort_values(ascending=False).head(3)

¿Qué calcula? ¿Debería coincidir con el groupby de la sección 2?

Predicción#

Con window=12, ¿cuántas filas iniciales de roll_df son NaN? ¿Y con window=1?

Depuración#

"Mi gráfico sale con 14 líneas pero sin leyenda, aunque puse label=". ¿Qué falta?

Modificación#

Cambia el gráfico de todas las líneas para que muestre solo los lenguajes cuyo total supere el millón de publicaciones.

Creación#

Escribe el código que encuentre, para cada año, el lenguaje con más publicaciones, y muéstralo como una tabla de dos columnas (año, lenguaje).