Update app.py

app.py

@@ -3,6 +3,9 @@ import numpy as np
 import plotly.express as px
 import plotly.graph_objects as go
 import gradio as gr
+from gradio.components import Plot
+
+#DATOS
 
 cities_data = {
     'Abancay': {
@@ -1148,6 +1151,8 @@ cities_data = {
 }
 
 
+#DATOS
+
 COLORES = {
     'Total': '#2C3E50',
     'Hombres': '#3498DB',
@@ -1170,15 +1175,7 @@ def normalizar_nombres_ciudades(nombre):
         'Juliana': 'Juliaca',
         'Chimbote': 'Chimbote',
         'Arequipa': 'Arequipa',
-        'Trujillo': 'Trujillo',
-        'Cervo de Pasco': 'Cerro de Pasco',
-        'Lima Metropolitana y la Provincia Constitucional del Calleo': 'Lima-Callao',
-        'Moyaegua': 'Moquegua',
-        'Mayobamba': 'Moyobamba',
-        'Hueva': 'Huancavelica',
-        'Pluto Júnior': 'Piura',
-        'Guido Mianzano': 'Cajamarca',
-        'Guyo Morales': 'Ayacucho'
+        'Trujillo': 'Trujillo'
     }
     return correcciones.get(nombre, nombre)
 
@@ -1198,7 +1195,10 @@ def crear_grafico_lineas(df, titulo, eje_y, formato=None):
                 y=df[columna],
                 name=columna,
                 mode='lines+markers',
-                line=dict(color=COLORES.get(columna, '#000000'), width=3),
+                line=dict(
+                    color=COLORES.get(columna, '#000000'), 
+                    width=3
+                ),
                 marker=dict(size=8),
                 hovertemplate=f'<b>{columna}</b>: %{{y:{formato or ".2f"}}}<extra></extra>'
             ))
@@ -1209,8 +1209,14 @@ def crear_grafico_lineas(df, titulo, eje_y, formato=None):
         xaxis_title='Periodo',
         hovermode='x unified',
         template='plotly_white',
-        legend=dict(orientation="h", yanchor="bottom", y=1.02, xanchor="right", x=1),
-        height=400
+        legend=dict(
+            orientation="h",
+            yanchor="bottom",
+            y=1.02,
+            xanchor="right",
+            x=1
+        ),
+        height=500
     )
     
     if formato:
@@ -1219,122 +1225,120 @@ def crear_grafico_lineas(df, titulo, eje_y, formato=None):
     return fig
 
 def crear_radar_plot(dfs):
-    try:
-        metricas = {
-            'Desempleo': dfs['desempleo']['Total'].iloc[-1],
-            'Informalidad': dfs['informal']['Total'].iloc[-1],
-            'Actividad': dfs['actividad']['Total'].iloc[-1],
-            'Brecha Salarial': ((dfs['ingresos']['Hombres'].iloc[-1] - 
-                               dfs['ingresos']['Mujeres'].iloc[-1]) / 
-                              dfs['ingresos']['Hombres'].iloc[-1]) * 100
-        }
-        
-        fig = go.Figure()
-        fig.add_trace(go.Scatterpolar(
-            r=list(metricas.values()) + [list(metricas.values())[0]],
-            theta=list(metricas.keys()) + [list(metricas.keys())[0]],
-            fill='toself',
-            fillcolor='rgba(142, 68, 173, 0.2)',
-            line=dict(color=COLORES['Brecha'], width=2),
-            name='Indicadores'
-        ))
-        
-        fig.update_layout(
-            polar=dict(
-                radialaxis=dict(visible=True, range=[0, 100]),
-                angularaxis=dict(rotation=90, direction='clockwise')
-            ),
-            title=dict(text='Radar de Indicadores Clave', x=0.5, font=dict(size=22)),
-            showlegend=False,
-            height=500,
-            margin=dict(t=80, b=80)
-        )
-        return fig
+    metricas = {}
     
-    except Exception as e:
-        print(f"Error generando radar plot: {str(e)}")
+    try:
+        metricas['Desempleo'] = dfs['desempleo']['Total'].iloc[-1]
+        metricas['Informalidad'] = dfs['informal']['Total'].iloc[-1]
+        metricas['Actividad'] = dfs['actividad']['Total'].iloc[-1]
+        metricas['Brecha Salarial'] = ((dfs['ingresos']['Hombres'].iloc[-1] - 
+                                      dfs['ingresos']['Mujeres'].iloc[-1]) / 
+                                     dfs['ingresos']['Hombres'].iloc[-1]) * 100
+    except (KeyError, IndexError, ZeroDivisionError) as e:
+        print(f"Error al generar radar plot: {str(e)}")
         return go.Figure()
-
-def crear_grafico_barras_anual(df, titulo, eje_y, columna_metricas, palette):
-    df['Año'] = df['Periodo'].str.split('-').str[0]
-    df = df.groupby(['Ciudad', 'Año'], as_index=False)[columna_metricas].mean()
     
-    fig = px.bar(df,
-                 x='Ciudad',
-                 y=columna_metricas,
-                 color='Año',
-                 barmode='group',
-                 title=f'<b>{titulo}</b>',
-                 labels={columna_metricas: eje_y},
-                 color_discrete_sequence=palette,
-                 height=600)
+    categories = list(metricas.keys())
+    values = list(metricas.values())
+    
+    fig = go.Figure()
+    
+    fig.add_trace(go.Scatterpolar(
+        r=values + [values[0]],
+        theta=categories + [categories[0]],
+        fill='toself',
+        fillcolor='rgba(142, 68, 173, 0.2)',
+        line=dict(color=COLORES['Brecha'], width=2),
+        name='Indicadores'
+    ))
     
     fig.update_layout(
-        xaxis_title='Ciudad',
-        yaxis_title=eje_y,
-        legend_title='Año',
-        xaxis={'categoryorder': 'total descending'},
-        uniformtext_minsize=8,
-        margin=dict(b=150, t=80),
-        hovermode='x unified'
+        polar=dict(
+            radialaxis=dict(visible=True, range=[0, 100], tickfont=dict(size=12)),
+            angularaxis=dict(rotation=90, direction='clockwise', tickfont=dict(size=14))
+        ),
+        title=dict(text='Radar de Indicadores Laborales', x=0.5, font=dict(size=20)),
+        showlegend=False,
+        height=500
     )
     
-    fig.update_xaxes(tickangle=45)
     return fig
 
-def generar_analisis_global():
-    figs = []
+def analisis_comparativo_desempleo():
+    datos = []
     
-    # 1. Ranking de Desempleo
-    datos_desempleo = []
     for ciudad, data in cities_data.items():
         nombre = normalizar_nombres_ciudades(ciudad)
-        df = procesar_dataframe(data['desempleo_trimestral'], ["Trimestre", "Total", "Hombres", "Mujeres"])
+        df = procesar_dataframe(data['desempleo_trimestral'], 
+                              ["Trimestre", "Total", "Hombres", "Mujeres"])
         if not df.empty:
-            datos_desempleo.append({'Ciudad': nombre, 'Desempleo': df['Total'].iloc[-1]})
+            ultimo_valor = df['Total'].iloc[-1]
+            datos.append({'Ciudad': nombre, 'Desempleo': ultimo_valor})
     
-    if datos_desempleo:
-        df_desempleo = pd.DataFrame(datos_desempleo).sort_values('Desempleo', ascending=False)
-        fig = px.bar(df_desempleo, 
-                    x='Ciudad', 
-                    y='Desempleo',
-                    color='Desempleo',
-                    color_continuous_scale='Bluered',
-                    text_auto='.1f%',
-                    title='<b>Comparación de Tasa de Desempleo entre Ciudades</b>',
-                    height=600)
-        fig.update_layout(xaxis={'categoryorder':'total descending'}, margin=dict(b=150))
-        figs.append(fig)
-    else:
-        figs.append(go.Figure())
+    if not datos:
+        return go.Figure()
+    
+    df_comparativo = pd.DataFrame(datos).sort_values('Desempleo', ascending=False)
+    
+    fig = px.bar(df_comparativo, 
+                x='Ciudad', 
+                y='Desempleo',
+                color='Desempleo',
+                color_continuous_scale='Bluered',
+                text_auto='.1f%',
+                title='Comparación de Tasa de Desempleo entre Ciudades')
     
-    # 2. Evolución de Ingresos
+    fig.update_layout(
+        xaxis_title='',
+        yaxis_title='Tasa de Desempleo (%)',
+        coloraxis_showscale=False,
+        xaxis={'categoryorder':'total descending'},
+        height=600
+    )
+    
+    return fig
+
+def generar_analisis_global():
+    figs = []
+    
+    # Gráfico comparativo de desempleo
+    figs.append(analisis_comparativo_desempleo())
+    
+    # Gráfico de tendencia de ingresos (full width)
     datos_ingresos = []
     for ciudad, data in cities_data.items():
         nombre = normalizar_nombres_ciudades(ciudad)
-        df = procesar_dataframe(data['ingresos_periodo'], ["Periodo", "Total", "Hombres", "Mujeres"])
+        df = procesar_dataframe(data['ingresos_periodo'], 
+                              ["Periodo", "Total", "Hombres", "Mujeres"])
         if not df.empty:
             df['Ciudad'] = nombre
             datos_ingresos.append(df)
     
     if datos_ingresos:
         df_ingresos = pd.concat(datos_ingresos)
-        fig_ingresos = crear_grafico_barras_anual(
-            df_ingresos,
-            'Evolución Anual de Ingresos Promedio por Ciudad',
-            'Ingresos (Soles)',
-            'Total',
-            px.colors.sequential.Viridis
+        fig_ingresos = px.line(df_ingresos, 
+                              x='Periodo', 
+                              y='Total', 
+                              color='Ciudad',
+                              title='<b>Evolución Histórica de Ingresos Promedio por Ciudad</b>',
+                              markers=True,
+                              height=600)
+        fig_ingresos.update_layout(
+            xaxis_title='Periodo',
+            yaxis_title='Ingresos (Soles)',
+            legend=dict(title='Ciudades'),
+            margin=dict(l=50, r=50, t=80, b=50)
         )
         figs.append(fig_ingresos)
     else:
         figs.append(go.Figure())
     
-    # 3. Evolución de Brecha Salarial
+    # Gráfico de brecha salarial (full width)
     datos_brecha = []
     for ciudad, data in cities_data.items():
         nombre = normalizar_nombres_ciudades(ciudad)
-        df = procesar_dataframe(data['ingresos_periodo'], ["Periodo", "Total", "Hombres", "Mujeres"])
+        df = procesar_dataframe(data['ingresos_periodo'], 
+                              ["Periodo", "Total", "Hombres", "Mujeres"])
         if not df.empty:
             df['Brecha'] = (df['Hombres'] - df['Mujeres']) / df['Hombres'].replace(0, np.nan) * 100
             df['Ciudad'] = nombre
@@ -1342,12 +1346,23 @@ def generar_analisis_global():
     
     if datos_brecha:
         df_brecha = pd.concat(datos_brecha)
-        fig_brecha = crear_grafico_barras_anual(
-            df_brecha,
-            'Evolución Anual de la Brecha Salarial por Ciudad',
-            'Brecha Salarial (%)',
-            'Brecha',
-            px.colors.diverging.RdYlGn
+        fig_brecha = px.bar(df_brecha, 
+                           x='Ciudad', 
+                           y='Brecha',
+                           color='Brecha',
+                           title='<b>Comparación de Brecha Salarial por Ciudad</b>',
+                           text_auto='.1f%',
+                           height=600,
+                           color_continuous_scale='Viridis')
+        
+        fig_brecha.update_layout(
+            xaxis_title='Ciudad',
+            yaxis_title='Brecha Salarial (%)',
+            coloraxis_showscale=False,
+            xaxis={'categoryorder':'total descending'},
+            margin=dict(l=50, r=50, t=80, b=150),
+            uniformtext_minsize=8,
+            uniformtext_mode='hide'
         )
         figs.append(fig_brecha)
     else:
@@ -1357,7 +1372,6 @@ def generar_analisis_global():
 
 def actualizar_graficos(ciudad):
     data = cities_data[ciudad]
-    nombre_ciudad = normalizar_nombres_ciudades(ciudad)
     
     dfs = {
         'desempleo': procesar_dataframe(data['desempleo_trimestral'], ["Trimestre", "Total", "Hombres", "Mujeres"]),
@@ -1367,80 +1381,66 @@ def actualizar_graficos(ciudad):
     }
     
     return [
-        crear_radar_plot(dfs),
         crear_grafico_lineas(dfs['desempleo'], "Tasa de Desempleo", "%", ".1f"),
         crear_grafico_lineas(dfs['ingresos'], "Ingresos Promedio", "Soles", ".0f"),
         crear_grafico_lineas(dfs['informal'], "Tasa de Informalidad", "%", ".1f"),
         crear_grafico_lineas(dfs['actividad'], "Tasa de Actividad", "%", ".1f"),
+        crear_radar_plot(dfs),
         crear_grafico_lineas(dfs['ingresos'].assign(
             Brecha=lambda x: (x['Hombres'] - x['Mujeres']) / x['Hombres'].replace(0, np.nan) * 100
-        ), "Brecha Salarial de Género", "%", ".1f")
+        ), "Brecha Salarial", "%", ".1f")
     ]
 
-with gr.Blocks(
-    title="Análisis Mercado Laboral Peruano",
-    css="""
+with gr.Blocks(theme=gr.themes.Soft(primary_hue="blue"), css="""
     .gradio-container {background-color: #f8f9fa}
-    .card {border: 1px solid #e0e0e0; border-radius: 8px; padding: 20px; margin: 10px 0; background: white}
-    .header {font-size: 28px; font-weight: bold; color: #2c3e50; margin-bottom: 20px}
-    .subheader {font-size: 20px; color: #3498db; margin: 15px 0}
-    """
-) as app:
+    .plot-container {margin: 20px 0}
+    """) as app:
     
-    gr.Markdown("# 📊 Dashboard del Mercado Laboral Peruano", elem_classes="header")
+    gr.Markdown("# 📊 Dashboard Analítico del Mercado Laboral Peruano")
     
-    ciudad = gr.Dropdown(
-        list(cities_data.keys()),
-        label="Seleccionar Ciudad",
-        value="Chimbote",
-        interactive=True
-    )
+    with gr.Row():
+        ciudad = gr.Dropdown(
+            list(cities_data.keys()),
+            label="Seleccionar Ciudad",
+            value="Chimbote",
+            interactive=True
+        )
     
     with gr.Tab("Análisis por Ciudad"):
-        with gr.Column(elem_classes="card"):
-            gr.Markdown("## 📍 Indicadores Clave", elem_classes="subheader")
-            radar_plot = gr.Plot()
-        
-        with gr.Column(elem_classes="card"):
-            gr.Markdown("## 📈 Tendencias Principales", elem_classes="subheader")
-            with gr.Row():
-                desempleo_plot = gr.Plot()
-                ingresos_plot = gr.Plot()
-            with gr.Row():
-                informalidad_plot = gr.Plot()
-                actividad_plot = gr.Plot()
-        
-        with gr.Column(elem_classes="card"):
-            gr.Markdown("## 📉 Brecha Salarial", elem_classes="subheader")
-            brecha_plot = gr.Plot()
+        with gr.Row():
+            desempleo_plot = Plot(label="Tasa de Desempleo")
+        with gr.Row():
+            ingresos_plot = Plot(label="Ingresos Promedio")
+        with gr.Row():
+            informalidad_plot = Plot(label="Tasa de Informalidad")
+        with gr.Row():
+            actividad_plot = Plot(label="Tasa de Actividad")
+        with gr.Row():
+            radar_plot = Plot(label="Radar de Indicadores")
+        with gr.Row():
+            brecha_plot = Plot(label="Brecha Salarial")
     
     with gr.Tab("Análisis Comparativo"):
-        with gr.Column(elem_classes="card"):
-            gr.Markdown("## 🏙️ Comparativa entre Ciudades", elem_classes="subheader")
-            global_desempleo = gr.Plot()
-            global_ingresos = gr.Plot()
-            global_brecha = gr.Plot()
-
-    @app.load()
-    def cargar_inicial():
-        datos_ciudad = actualizar_graficos("Chimbote")
-        datos_global = generar_analisis_global()
-        return {
-            radar_plot: datos_ciudad[0],
-            desempleo_plot: datos_ciudad[1],
-            ingresos_plot: datos_ciudad[2],
-            informalidad_plot: datos_ciudad[3],
-            actividad_plot: datos_ciudad[4],
-            brecha_plot: datos_ciudad[5],
-            global_desempleo: datos_global[0],
-            global_ingresos: datos_global[1],
-            global_brecha: datos_global[2]
-        }
+        with gr.Row():
+            global_desempleo = Plot(label="Ranking de Desempleo")
+        with gr.Row():
+            global_ingresos = Plot(label="Evolución de Ingresos")
+        with gr.Row():
+            global_brecha = Plot(label="Comparación de Brecha Salarial")
+        with gr.Row():
+            global_btn = gr.Button("Actualizar Datos", variant="primary")
 
+    # Eventos
     ciudad.change(
         fn=actualizar_graficos,
         inputs=ciudad,
-        outputs=[radar_plot, desempleo_plot, ingresos_plot, informalidad_plot, actividad_plot, brecha_plot]
+        outputs=[desempleo_plot, ingresos_plot, informalidad_plot, actividad_plot, radar_plot, brecha_plot]
+    )
+    
+    global_btn.click(
+        fn=generar_analisis_global,
+        inputs=[],
+        outputs=[global_desempleo, global_ingresos, global_brecha]
     )
 
-app.launch(debug=True, share=False)
+app.launch(debug=True)