Un gráfico de barras representa valores de datos mediante barras verticales, lo que permite comparar distintos conjuntos en paralelo y, en ocasiones, visualizar tendencias. Este tipo de gráfico refleja la relación entre una variable categórica y una numérica: cada categoría se muestra como una barra cuyo tamaño corresponde a su valor. Aunque a menudo se considera una forma simple o incluso poco atractiva de visualización, en realidad es una de las más efectivas para este propósito.

Para mejorar su claridad, conviene:
- Ordenar las barras (especialmente de mayor a menor si la data no tiene un orden natural).
- Añadir anotaciones adecuadas.
- Iniciar siempre en cero para evitar distorsiones.
- Verificar si los ejes son necesarios (en ocasiones pueden eliminarse para simplificar).
- Elegir colores adecuados que faciliten la comparación y resalten la información clave.

0.0.1 Errores habituales:

No debe confundirse con un histograma.
Si las etiquetas de las categorías son extensas, es recomendable usar la versión horizontal.
Ordenar las barras suele ayudar a transmitir mejor la información.

1 Dataset: Precios Agroindustria de Cacao (2012 - 2025)

Archivo: MAG_PreciosAgroindustriaCacao_2025Junio.csv
Fuente: Ministerio de Agricultura y Ganadería (MAG), Ecuador
Última actualización: Junio 2025

import pandas as pd
df = pd.read_csv("mag_preciosagroindustriacacao_2025junio.csv", sep=";")
print(df.head())
print(df.info())

   PACC_ANIO PACC_MES DPA_PROVINCIA DPA_CANTON        PACC_PRODUCTO  \
0       2012    Enero        El Oro  Arenillas  Cacao seco mezclado   
1       2012    Enero        El Oro  Arenillas  Cacao seco mezclado   
2       2012    Enero        El Oro   El Guabo  Cacao seco mezclado   
3       2012    Enero        El Oro   El Guabo  Cacao seco mezclado   
4       2012    Enero        El Oro    Machala  Cacao seco mezclado   

          PACC_PRESENTACION PACC_TIPO  PACC_PRECIO_USD  PACC_USD_KG  
0  Quintal de 100,00 libras    Compra            71.41         1.57  
1  Quintal de 100,00 libras     Venta            74.06         1.63  
2  Quintal de 100,00 libras    Compra            73.75         1.63  
3  Quintal de 100,00 libras     Venta            84.00         1.85  
4  Quintal de 100,00 libras    Compra            75.00         1.65  
<class 'pandas.core.frame.DataFrame'>
RangeIndex: 26246 entries, 0 to 26245
Data columns (total 9 columns):
 #   Column             Non-Null Count  Dtype  
---  ------             --------------  -----  
 0   PACC_ANIO          26246 non-null  int64  
 1   PACC_MES           26246 non-null  object 
 2   DPA_PROVINCIA      26246 non-null  object 
 3   DPA_CANTON         26246 non-null  object 
 4   PACC_PRODUCTO      26246 non-null  object 
 5   PACC_PRESENTACION  26246 non-null  object 
 6   PACC_TIPO          26246 non-null  object 
 7   PACC_PRECIO_USD    26246 non-null  float64
 8   PACC_USD_KG        26246 non-null  float64
dtypes: float64(2), int64(1), object(6)
memory usage: 1.8+ MB
None

2 Plotly

Plotly es una biblioteca de visualización interactiva para Python.
Se centra en la creación de gráficos dinámicos y personalizables que permiten explorar los datos con facilidad.
Gracias a su integración con Dash, también es ampliamente utilizada para el desarrollo de dashboards interactivos y aplicaciones web de análisis de datos.

2.1 Ventajas de Plotly

Interactividad avanzada: zoom, hover, selección de datos, filtros dinámicos.
Amplia variedad de gráficos: desde básicos (barras, líneas, dispersión) hasta complejos (mapas geoespaciales, gráficos 3D, series temporales).
Integración con Dash: permite crear aplicaciones web de análisis sin necesidad de conocimientos avanzados de front-end.
Compatibilidad con múltiples lenguajes: Python, R, Julia y JavaScript.
Listo para producción: ideal para storytelling con datos, reportes ejecutivos y presentaciones interactivas.

2.2 Página oficial y documentación

Sitio web: Plotly Python Open Source Graphing Library – incluye secciones como Getting Started, Gallery, API Reference y Dash.


import plotly.express as px
import plotly.io as pio
pio.renderers.default = "notebook"


# Agrupar para obtener el precio promedio por año
df_avg_anio = df.groupby("PACC_ANIO", as_index=False)["PACC_PRECIO_USD"].mean()

# Gráfico de barras con colores personalizados
fig = px.bar(
    df_avg_anio,
    x="PACC_ANIO",
    y="PACC_PRECIO_USD",
    text="PACC_PRECIO_USD",
    color="PACC_PRECIO_USD",   # Colorear según valor
    color_continuous_scale="Viridis",  # Escala de color
    title="Precio promedio en USD por año",
    orientation="v",
    labels={"PACC_ANIO": "Año", "PACC_PRECIO_USD": "Precio USD"}
)

# valores encima de las barras
fig.update_traces(
    texttemplate="%{text:.2f}", 
    textposition="outside",
    marker=dict(line=dict(color="black", width=1))  # borde negro a cada barra
)

# Ajustar diseño general
fig.update_layout(
    xaxis=dict(
        type="category", 
        showgrid=True, 
        showline=True, 
        linewidth=2, 
        linecolor="black", 
        tickangle=0  # puedes poner -45 si hay muchos años
    ),
    yaxis=dict(
        showgrid=True, 
        gridcolor="lightgray", 
        zeroline=False, 
        title="Precio USD"
    ),
    title=dict(
        font=dict(size=22, family="Arial", color="darkblue"),
        x=0.5,  # centrar título
        xanchor="center"
    ),
    plot_bgcolor="white",   # fondo blanco
    paper_bgcolor="white",
    font=dict(family="Arial", size=14, color="black"),
    margin=dict(l=40, r=40, t=80, b=40)
)

# Mostrar gráfico
fig.show()


import plotly.express as px

# Gráfico de barras con colores personalizados
fig = px.bar(
    df_avg_anio,
    x="PACC_ANIO",
    y="PACC_PRECIO_USD",
    text="PACC_PRECIO_USD",
    title="Precio promedio en (USD por año)",
)

# valores encima de las barras
fig.update_traces(
    texttemplate="%{text:.2f}", 
    textposition="outside",
    marker=dict(line=dict(color="black", width=1))  # borde negro a cada barra
)

# Ajustar diseño general
fig.update_layout(
    xaxis=dict(
        type="category", 
        showgrid=False, 
        showline=False, 
        linewidth=2, 
        linecolor="black", 
        tickangle=0 ,
        title=None 
    ),
    yaxis=dict(
        showgrid=False, 
        #gridcolor="lightgray", 
        zeroline=False, 
       # title="Precio USD",
        showticklabels=False,   #  oculta valores del eje Y
        title=None 
    ),
    title=dict(
        font=dict(size=22, family="Arial", color="darkblue"),
        x=0.5,  # centrar título
        xanchor="center"
    ),
    plot_bgcolor="white",   # fondo blanco
    paper_bgcolor="white",
    font=dict(family="Arial", size=14, color="black"),
    margin=dict(l=40, r=40, t=80, b=40)
)

# Mostrar gráfico
fig.show()

3 Panel (HoloViz)

Panel es una librería open-source de Python para crear dashboards, herramientas interactivas y aplicaciones multipágina sin escribir JavaScript. Se integra de forma natural con el ecosistema PyData (pandas, NumPy, Altair, Bokeh, Plotly, Matplotlib, etc.) y ofrece APIs reactivas y callbacks para construir desde prototipos rápidos hasta soluciones complejas listas para producción.

Qué ofrece - Widgets y layouts ricos (sliders, selects, tablas, tabs, grids) con diseño adaptable. - Interactividad declarativa (vinculación de parámetros) y basada en funciones. - Despliegue flexible: Jupyter, panel serve, servidores o exportación a HTML estático. - Parte del ecosistema HoloViz, interoperando con hvPlot, HoloViews y Datashader para datos de gran tamaño.

Ideal para - Exploración de datos interactiva. - Aplicaciones analíticas internas. - Prototipos y demos de ciencia de datos. - Dashboards de monitoreo y reporting.

3.1 Color

import panel as pn
pn.extension()

# Widget ColorPicker
colorpicker = pn.widgets.ColorPicker(name='Color Picker', value='#99ef78')
colorpicker

C:\Users\meagu\AppData\Local\Temp\ipykernel_29140\1456278253.py:2: UserWarning:

Using Panel interactively in VSCode notebooks requires the jupyter_bokeh package to be installed. You can install it with:

   pip install jupyter_bokeh

or:
    conda install jupyter_bokeh

and try again.

colorpicker.value

'#99ef78'

df.columns

Index(['PACC_ANIO', 'PACC_MES', 'DPA_PROVINCIA', 'DPA_CANTON', 'PACC_PRODUCTO',
       'PACC_PRESENTACION', 'PACC_TIPO', 'PACC_PRECIO_USD', 'PACC_USD_KG'],
      dtype='object')

import pandas as pd
import plotly.express as px

# 1) Filtrar 2025 (funciona si PACC_ANIO es int o str)
df_2025 = df[df["PACC_ANIO"].astype(str) == "2025"].copy()

# 2) Promedio por PRODUCTO (ya que agrupaste por producto)
df_avg_prod = (
    df_2025.groupby("PACC_PRODUCTO", as_index=False)
           .agg(PACC_PRECIO_USD=("PACC_PRECIO_USD", "mean"))
           #.sort_values("PACC_PRECIO_USD", ascending=False)
)

# 3) Gráfico
fig = px.bar(
    df_avg_prod,
    x="PACC_PRODUCTO",           # <-- antes estaba "PACC_ANIO" (no existe tras agrupar)
    y="PACC_PRECIO_USD",
    text="PACC_PRECIO_USD",
    title="Precio promedio (USD) por producto – 2025",
    
)

fig.update_traces(
    texttemplate="%{text:.2f}",
    textposition="outside",
    marker=dict(line=dict(color="black", width=1))
)

fig.update_layout(
    xaxis=dict(type="category", showgrid=False, showline=False, tickangle=0, title=None),
    yaxis=dict(showgrid=False, zeroline=False, showticklabels=False, title=None),
    title=dict(font=dict(size=22, family="Arial", color="darkblue"), x=0.5, xanchor="center"),
    plot_bgcolor="white", paper_bgcolor="white",
    font=dict(family="Arial", size=14, color="black"),
    margin=dict(l=40, r=40, t=80, b=40)
)

fig.show()

import pandas as pd
import plotly.express as px

# 1) Filtrar 2025
df_2025 = df[df["PACC_ANIO"].astype(str) == "2025"].copy()

# 2) Promedio por PRODUCTO
df_avg_prod = (
    df_2025.groupby("PACC_PRODUCTO", as_index=False)
           .agg(PROM_PRECIO_USD=("PACC_PRECIO_USD", "mean"))
)

# (Opcional) ordenar para controlar el orden visual (arriba→abajo)
df_avg_prod = df_avg_prod.sort_values("PROM_PRECIO_USD", ascending=True)

# 3) Gráfico horizontal (x = métrica, y = categoría)
fig = px.bar(
    df_avg_prod,
    x="PROM_PRECIO_USD",
    y="PACC_PRODUCTO",
    text="PROM_PRECIO_USD",
    title="Precio promedio (USD) por producto – 2025",
    orientation="h",
)

fig.update_traces(
    texttemplate="%{text:.2f}",
    textposition="outside",
    marker=dict(line=dict(color="black", width=1))
)

fig.update_layout(
    xaxis=dict(title=None, showgrid=False, zeroline=False),
    yaxis=dict(
        title=None, showgrid=False,
        categoryorder="array",                   # respeta tu orden
        categoryarray=df_avg_prod["PACC_PRODUCTO"].tolist()
    ),
    title=dict(font=dict(size=22, family="Arial", color="darkblue"), x=0.5, xanchor="center"),
    plot_bgcolor="white", paper_bgcolor="white",
    font=dict(family="Arial", size=14, color="black"),
    margin=dict(l=10, r=90, t=80, b=40),       # margen derecho para textos "outside"
    height=40*len(df_avg_prod) + 200           # (opcional) altura dinámica
)

# Si quieres el mayor valor arriba:
# fig.update_yaxes(autorange="reversed")

fig.show()

Gráfico de Barras