Include Multiselect

app.py

@@ -1,9 +1,8 @@
 import streamlit as st
 import pandas as pd
 from bokeh.plotting import figure
-from bokeh.models import ColumnDataSource, HoverTool
+from bokeh.models import ColumnDataSource
 from bokeh.palettes import Category10
-from bokeh.transform import factor_cmap
 
 # --- Define Styles ---
 st.markdown(
@@ -32,27 +31,17 @@ st.markdown('<h2 class="sub-title">Donut</h2>', unsafe_allow_html=True)
 st.markdown(
     """
     <p class="custom-text">
-    Explore how Donut perceive real data. 
+    Explore how Donut perceives real data. 
     </p>
     """,
     unsafe_allow_html=True
 )
 
-# Get Data
+# Cargar el CSV
 df = pd.read_csv("data/data.csv")
-
-source = ColumnDataSource(data=dict(
-    x=df['x'],
-    y=df['y'],
-    label=df['label'],
-    img=df['img']
-))
-
 unique_labels = df['label'].unique().tolist()
-palette = Category10[len(unique_labels)] if len(unique_labels) <= 10 else Category10[10]
-
 
-# Configure figure
+# Definir tooltips para la imagen y la etiqueta
 TOOLTIPS = """
 <div>
     <div>
@@ -64,8 +53,53 @@ TOOLTIPS = """
 </div>
 """
 
+# Crear contenedor para el gráfico
+plot_placeholder = st.empty()
+
+# Función que genera y muestra el gráfico a partir de una lista de labels
+def render_plot(selected_labels):
+    if not selected_labels:
+        st.write("No data to display. Please select at least one subset.")
+        return
+
+    filtered_data = df[df['label'].isin(selected_labels)]
+    p = figure(width=400, height=400, tooltips=TOOLTIPS, title="")
+    
+    num_labels = len(selected_labels)
+    # Ajuste de la paleta
+    if num_labels < 3:
+        palette = Category10[3][:num_labels]
+    elif num_labels in [3, 4, 5, 6, 7, 8, 9, 10]:
+        palette = Category10[num_labels]
+    else:
+        palette = Category10[10][:num_labels]
 
-p = figure(width=400, height=400, tooltips=TOOLTIPS, title="")
-p.scatter('x', 'y', size=8, source=source, color=factor_cmap('label', palette=palette, factors=unique_labels))
+    # Graficar cada label por separado para poder asignar su color y legend_label
+    for label, color in zip(selected_labels, palette):
+        subset = filtered_data[filtered_data['label'] == label]
+        source = ColumnDataSource(data=dict(
+            x=subset['x'],
+            y=subset['y'],
+            label=subset['label'],
+            img=subset['img']
+        ))
+        p.scatter('x', 'y', size=8, source=source, color=color, legend_label=label)
+    
+    p.legend.title = "Subsets"
+    p.legend.location = "top_right"
+    p.legend.click_policy = "hide"
+
+    plot_placeholder.bokeh_chart(p)
+
+# Mostrar inicialmente el gráfico con todas las etiquetas
+render_plot(unique_labels)
+
+# --- Desplegable (multiselect) colocado debajo del gráfico ---
+selected_labels = st.multiselect(
+    "Select Subsets to Visualize:",
+    options=unique_labels,
+    default=unique_labels
+)
 
-st.bokeh_chart(p)
+# Al cambiar la selección, volver a renderizar el gráfico
+render_plot(selected_labels)