Update app.py

app.py

@@ -1,7 +1,7 @@
 import streamlit as st
-import plotly.graph_objects as go
+import plotly.express as px
 import pandas as pd
-from datetime import datetime
+from datetime import datetime, timedelta
 
 # Configuración de la página
 st.set_page_config(page_title="Generador de Franjas de Tiempo Apiladas", layout="wide")
@@ -11,11 +11,6 @@ def hex_to_rgba(hex_color, alpha=1.0):
     hex_color = hex_color.lstrip('#')
     return f'rgba({int(hex_color[0:2], 16)},{int(hex_color[2:4], 16)},{int(hex_color[4:6], 16)},{alpha})'
 
-# Lista de colores predefinidos
-predefined_colors = [
-    "#FF5C5C", "#5CCFFF", "#FFA500", "#90EE90", "#9370DB", "#FFD700"
-]
-
 # Sidebar para la configuración del gráfico
 st.sidebar.header("Configuración del Gráfico")
 
@@ -50,36 +45,29 @@ for y_name, (start_date, end_date) in y_values.items():
 
 data = pd.DataFrame(data_list)
 
-# Crear gráfico de franjas de tiempo usando plotly.graph_objects
-fig = go.Figure()
-
-# Agregar cada serie de tiempo al gráfico
-colors = predefined_colors  # Lista de colores predefinidos
-
-for i, (y_name, (start_date, end_date)) in enumerate(y_values.items()):
-    start_date = pd.to_datetime(start_date)
-    end_date = pd.to_datetime(end_date)
-    
-    fig.add_trace(go.Bar(
-        y=[y_name],
-        x=[(end_date - start_date).days],
-        base=start_date,
-        orientation='h',
-        name=y_name,
-        marker_color=colors[i % len(colors)],
-        text=f'{y_name}: {start_date.date()} - {end_date.date()}',
-        textposition='inside',
-        width=0.5
-    ))
+# Ajustar fechas para simular apilamiento si está activado
+if stacked:
+    # Crear una nueva columna para apilar
+    data['Stacked_Start'] = data.groupby('Variable').cumcount() * timedelta(days=1)
+    data['Stacked_End'] = data['Stacked_Start'] + (data['End'] - data['Start'])
+
+# Crear gráfico de franjas de tiempo
+fig = px.timeline(data, x_start="Stacked_Start" if stacked else "Start", x_end="Stacked_End" if stacked else "End", y="Variable", color="Variable", title=chart_title)
 
 # Actualizar el diseño del gráfico
+fig.update_yaxes(categoryorder="total ascending")
+
+# Personalizar el formato de tiempo en el eje X
+if time_format == "Año":
+    tickformat = "%Y"
+else:
+    tickformat = "%Y-%m-%d"  # Ajusta según el formato deseado
+
 fig.update_layout(
-    title=chart_title,
     xaxis_title="Tiempo",
     yaxis_title="Variables",
-    barmode='stack' if stacked else 'group',
     xaxis=dict(
-        tickformat="%Y-%m-%d" if time_format != "Año" else "%Y",
+        tickformat=tickformat,
         titlefont=dict(size=14),
         tickfont=dict(size=12),
     ),