Update app.py

app.py

@@ -1,22 +1,16 @@
 import streamlit as st
 import plotly.express as px
 import pandas as pd
-import numpy as np
 from datetime import datetime
 
 # Configuración de la página
-st.set_page_config(page_title="Generador de Gráficos Personalizado", layout="wide")
+st.set_page_config(page_title="Generador de Franjas de Tiempo Apiladas", layout="wide")
 
 # Función para convertir HEX a RGBA con transparencia
 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})'
 
-# Colores predefinidos
-predefined_colors = [
-    "#FF5C5C", "#5CCFFF", "#FFA500", "#90EE90", "#9370DB", "#FFD700"
-]
-
 # Lista de fuentes más utilizadas
 font_options = [
     "Times New Roman", "Arial", "Helvetica", "Calibri", "Verdana", 
@@ -27,219 +21,70 @@ font_options = [
 st.sidebar.header("Configuración del Gráfico")
 
 # Título del gráfico
-chart_title = st.sidebar.text_input("Título del Gráfico", "Generador de Gráfico")
-
-# Tipo de gráfico
-chart_type = st.sidebar.selectbox("Tipo de Gráfico", ["Línea", "Área", "Dispersión", "Barras", "Donut", "Línea temporal"])
-
-# Función para generar rangos de fechas
-def generate_date_range(start_date, end_date, freq):
-    return pd.date_range(start=start_date, end=end_date, freq=freq).strftime('%Y-%m-%d').tolist()
-
-if chart_type == "Línea temporal":
-    time_unit = st.sidebar.selectbox("Unidad de tiempo", ["Días", "Meses", "Años"])
-    
-    if time_unit == "Días":
-        start_date = st.sidebar.date_input("Fecha de inicio", datetime(2023, 1, 1))
-        end_date = st.sidebar.date_input("Fecha de fin", datetime(2023, 12, 31))
-        x = generate_date_range(start_date, end_date, 'D')
-    elif time_unit == "Meses":
-        start_date = st.sidebar.date_input("Fecha de inicio", datetime(2023, 1, 1))
-        end_date = st.sidebar.date_input("Fecha de fin", datetime(2023, 12, 31))
-        x = generate_date_range(start_date, end_date, 'M')
-    elif time_unit == "Años":
-        start_year = st.sidebar.number_input("Año de inicio", min_value=2000, max_value=2100, value=2020)
-        end_year = st.sidebar.number_input("Año de fin", min_value=2000, max_value=2100, value=2023)
-        x = [str(year) for year in range(start_year, end_year + 1)]
-else:
-    # Ingresar valores para los ejes
-    x_values = st.sidebar.text_area("Valores para X (separados por comas)", "2013,2014,2015,2016,2017,2018")
-    x = x_values.split(",")
-
-# Selector de número de variables Y
-num_y_vars = st.sidebar.number_input("Número de variables Y", min_value=1, max_value=100, value=1, step=1, key="num_y_vars")
-y_values_list = []
-y_names_list = []
+chart_title = st.sidebar.text_input("Título del Gráfico", "Gráfico de Franjas de Tiempo Apiladas")
+
+# Seleccionar formato de tiempo
+time_format = st.sidebar.selectbox("Formato de Tiempo", ["Día", "Mes", "Año"])
+
+# Ingresar valores para franjas de tiempo
+num_y_vars = st.sidebar.number_input("Número de Variables Y", min_value=1, max_value=10, value=1, step=1)
+
+y_values = {}
 for i in range(num_y_vars):
-    if f"y_values_{i}" not in st.session_state:
-        st.session_state[f"y_values_{i}"] = ','.join([str(np.random.randint(1, 25)) for _ in x])
-    y_values = st.sidebar.text_area(f"Valores para Y-{i+1} (separados por comas)", st.session_state[f"y_values_{i}"], key=f"y_values_{i}")
-    y_name = st.sidebar.text_input(f"Nombre de la Variable Y-{i+1}", f"Variable Y-{i+1}", key=f"y_name_{i}")
-    y_values_list.append(y_values)
-    y_names_list.append(y_name)
-
-# Etiquetas personalizadas para los ejes
-x_label = st.sidebar.text_input("Etiqueta para el eje X", "X")
-y_label = st.sidebar.text_input("Etiqueta para el eje Y", "Y")
-
-# Desplegable de opciones adicionales
-with st.sidebar.expander("Opciones Adicionales"):
-    graph_width = st.slider("Ancho del Gráfico", min_value=400, max_value=1000, value=800, step=50)
-    graph_height = st.slider("Alto del Gráfico", min_value=300, max_value=800, value=600, step=50)
-    font_family = st.selectbox("Fuente", font_options, index=font_options.index("Times New Roman"))
-    show_legend = st.checkbox("Mostrar Leyenda", value=True)
-    opacity = st.slider("Opacidad (%)", min_value=0, max_value=100, value=30, step=1) / 100
-    border_width = st.slider("Grosor del Borde", min_value=0.0, max_value=3.0, value=1.5, step=0.1)
-    border_opacity = st.slider("Opacidad del Borde (%)", min_value=0, max_value=100, value=60, step=1) / 100
-    if chart_type == "Barras" and num_y_vars > 1:
-        stacked_bars = st.checkbox("Superpuestas", key="stacked_bars")
-    else:
-        stacked_bars = False
-    if chart_type == "Barras":
-        horizontal_bars = st.checkbox("Invertidas", key="horizontal_bars")
-    if chart_type == "Donut":
-        hole_size = st.slider("Tamaño del agujero (%)", min_value=0, max_value=100, value=30, step=1) / 100
-
-# Opción para múltiples colores (siempre activada para Donut)
-use_multiple_colors = st.sidebar.checkbox("Usar múltiples colores", value=True if chart_type == "Donut" or num_y_vars > 1 else False, key="use_multiple_colors")
-
-# Seleccionar color(es) para el gráfico
-selected_color = st.sidebar.color_picker("Color", "#24CBA0", key="single_color")
-
-# Definir colores
-if use_multiple_colors:
-    num_colors = len(x)
-    colors = [hex_to_rgba(st.sidebar.color_picker(f"Color {i+1}", predefined_colors[i % len(predefined_colors)], key=f"color_{i}"), alpha=opacity)
-              for i in range(num_colors)]
-    border_colors = [hex_to_rgba(st.sidebar.color_picker(f"Color de Borde {i+1}", predefined_colors[i % len(predefined_colors)], key=f"border_color_{i}"), alpha=border_opacity)
-                     for i in range(num_colors)]
+    y_start = st.sidebar.text_input(f"Fecha de Inicio para Y-{i+1} (YYYY-MM-DD)", key=f"y_start_{i}")
+    y_end = st.sidebar.text_input(f"Fecha de Fin para Y-{i+1} (YYYY-MM-DD)", key=f"y_end_{i}")
+    y_name = st.sidebar.text_input(f"Nombre de la Variable Y-{i+1}", key=f"y_name_{i}")
+    if y_start and y_end and y_name:
+        y_values[y_name] = (y_start, y_end)
+
+# Crear el DataFrame con franjas de tiempo
+data_list = []
+for y_name, (start_date, end_date) in y_values.items():
+    data_list.append({
+        'Variable': y_name,
+        'Start': datetime.strptime(start_date, '%Y-%m-%d'),
+        'End': datetime.strptime(end_date, '%Y-%m-%d')
+    })
+
+data = pd.DataFrame(data_list)
+
+# Convertir el DataFrame para el gráfico
+data['Duration'] = data['End'] - data['Start']
+data['Start'] = pd.to_datetime(data['Start'])
+data['End'] = pd.to_datetime(data['End'])
+
+# Crear gráfico
+fig = px.timeline(data, x_start="Start", x_end="End", y="Variable", color="Variable", title=chart_title)
+fig.update_yaxes(categoryorder="total ascending")
+
+# Personalizar el formato de tiempo en el eje X
+if time_format == "Día":
+    tickformat = "%d-%m-%Y"
+elif time_format == "Mes":
+    tickformat = "%Y-%m"
 else:
-    color = hex_to_rgba(selected_color, alpha=opacity)
-    border_color = hex_to_rgba(selected_color, alpha=border_opacity)
-    colors = [color] * len(x)  # Definir colors para casos donde no se usa múltiple colores
-
-# Procesar valores
-y_values_lists = [[float(i) for i in y_values.split(",") if i.strip()] for y_values in y_values_list]
-
-# Asegurar que todas las listas de Y tengan el mismo tamaño que X
-for y_values in y_values_lists:
-    while len(y_values) < len(x):
-        y_values.append(0)
-    while len(y_values) > len(x):
-        y_values.pop()
-
-# Crear un DataFrame
-data = pd.DataFrame({"X": x})
-for idx, y_set in enumerate(y_values_lists):
-    data[y_names_list[idx]] = y_set
-
-# Configuración común para todos los gráficos
-common_layout = dict(
-    xaxis_title=x_label,
-    yaxis_title=y_label,
-    plot_bgcolor="white",
-    hovermode="x unified",
-    width=graph_width,
-    height=graph_height,
+    tickformat = "%Y"
+
+fig.update_layout(
+    xaxis_title="Tiempo",
+    yaxis_title="Variables",
+    xaxis=dict(
+        tickformat=tickformat,
+        titlefont=dict(size=14),
+        tickfont=dict(size=12),
+    ),
+    yaxis=dict(
+        titlefont=dict(size=14),
+        tickfont=dict(size=12),
+    ),
+    width=800,
+    height=600,
     margin=dict(l=60, r=40, t=100, b=40),
-    xaxis=dict(showgrid=True, zeroline=True, gridcolor='rgba(211,211,211,0.5)', zerolinecolor='rgba(128,128,128,0.5)', autorange=True),
-    yaxis=dict(showgrid=True, zeroline=True, gridcolor='rgba(211,211,211,0.5)', zerolinecolor='rgba(128,128,128,0.5)', autorange=True),
-    font=dict(family=font_family, size=18, color="black"),
-    showlegend=show_legend,
-    legend=dict(orientation="v", yanchor="top", y=1, xanchor="left", x=1.02)
+    font=dict(family="Times New Roman", size=18, color="black")
 )
 
-# Personalizar el hovertemplate
-hovertemplate = '<b>%{y}</b>'
-
-# Generar el gráfico basado en el tipo seleccionado
-if chart_type == "Línea":
-    fig = px.line(data, x="X", y=y_names_list, line_shape="spline")
-    fig.update_traces(hovertemplate=hovertemplate)
-    if use_multiple_colors:
-        for i, name in enumerate(y_names_list):
-            fig.update_traces(selector=dict(name=name), line_color=colors[i % len(colors)])
-    else:
-        fig.update_traces(line_color=color)
-elif chart_type == "Área":
-    fig = px.area(data, x="X", y=y_names_list, line_shape="spline")
-    fig.update_traces(hovertemplate=hovertemplate)
-    if use_multiple_colors:
-        for i, name in enumerate(y_names_list):
-            fig.update_traces(selector=dict(name=name), line_color=colors[i % len(colors)], fillcolor=colors[i % len(colors)])
-    else:
-        fig.update_traces(line_color=color, fillcolor=color)
-elif chart_type == "Dispersión":
-    fig = px.scatter(data, x="X", y=y_names_list)
-    fig.update_traces(hovertemplate=hovertemplate)
-    if use_multiple_colors:
-        for i, name in enumerate(y_names_list):
-            fig.update_traces(selector=dict(name=name), marker_color=colors[i % len(colors)], marker_line_color=border_colors[i % len(border_colors)], marker_line_width=border_width)
-    else:
-        fig.update_traces(marker_color=color, marker_line_color=border_color, marker_line_width=border_width)
-elif chart_type == "Barras":
-    if horizontal_bars:
-        fig = px.bar(data, y="X", x=y_names_list, orientation='h', barmode='stack' if stacked_bars else 'group')
-    else:
-        fig = px.bar(data, x="X", y=y_names_list, barmode='stack' if stacked_bars else 'group')
-    fig.update_traces(hovertemplate=hovertemplate)
-    if use_multiple_colors:
-        if len(y_names_list) == 1:  # Solo una variable Y
-            fig.update_traces(marker_color=colors[:len(x)], marker_line_color=border_colors[:len(x)], marker_line_width=border_width)
-        else:
-            for i, trace in enumerate(fig.data):
-                trace.marker.color = colors[i % len(colors)]
-                trace.marker.line.color = border_colors[i % len(border_colors)]
-                trace.marker.line.width = border_width
-    else:
-        fig.update_traces(marker_color=color, marker_line_color=border_color, marker_line_width=border_width)
-    fig.update_layout(bargap=0.2)
-elif chart_type == "Donut":
-    figs = []
-    for i, y_name in enumerate(y_names_list):
-        fig = px.pie(data, values=y_name, names="X", hole=hole_size, color_discrete_sequence=colors[:len(x)])
-        fig.update_traces(hovertemplate='<b>%{label}</b>: %{value} (%{percent})', textinfo='percent+label')
-        fig.update_layout(
-            title=dict(
-                text=f"{chart_title}<br><sub>{y_name}</sub>" if len(y_names_list) > 1 else chart_title,
-                x=0.5,
-                y=0.95,
-                xanchor='center',
-                yanchor='top',
-                font=dict(
-                    family=font_family,
-                    size=18,
-                    color="#374151",
-                    weight="normal"
-                )
-            ),
-            **common_layout
-        )
-        figs.append(fig)
-    for fig in figs:
-        st.plotly_chart(fig)
-
-# Añadir anotación para el título
-if chart_type != "Donut":
-    fig.update_layout(
-        title=dict(
-            text=f"{chart_title}",
-            x=0.5,
-            y=0.95,
-            xanchor='center',
-            yanchor='top',
-            font=dict(
-                family=font_family,
-                size=18,
-                color="#374151",
-                weight="normal"
-            )
-        )
-    )
-    
-    # Aplicar configuración común
-    fig.update_layout(**common_layout)
-    
-    # Aplicar múltiples colores si se seleccionó la opción
-    if use_multiple_colors and chart_type != "Donut":
-        for i, trace in enumerate(fig.data):
-            trace.update(marker_color=colors[i % len(colors)], marker_line_color=border_colors[i % len(border_colors)], marker_line_width=border_width)
-    
-    # Mostrar el gráfico
-    st.plotly_chart(fig)
-
-    # Forzar el autoescale
-    fig.update_layout(xaxis_autorange=True, yaxis_autorange=True)
+# Mostrar el gráfico
+st.plotly_chart(fig)
 
 # Información adicional
 st.write("Aquí puede añadir información adicional sobre los gráficos generados.")