Update dashboard.py

dashboard.py

@@ -34,6 +34,8 @@ from bokeh.resources import INLINE
 from holoviews.operation.timeseries import rolling, rolling_outlier_std
 hv.extension('bokeh')
 from scipy.ndimage import gaussian_filter1d
+from bokeh.models import Legend, LegendItem
+
 
 import os
 os.environ['MPLCONFIGDIR'] = '/tmp/matplotlib'
@@ -380,6 +382,50 @@ def create_overlay_plot(subject_df):
     )
     return overlay
 
+def custom_legend_below(plot, element):
+    from bokeh.models import Legend
+    p = plot.state
+
+    # Collect renderers and labels
+    renderers = []
+    labels = []
+    for r in p.renderers:
+        if hasattr(r, 'glyph') and hasattr(r, 'name') and r.name:
+            renderers.append(r)
+            labels.append(r.name)
+        elif hasattr(r, 'glyph') and hasattr(r, 'label'):
+            renderers.append(r)
+            labels.append(r.label.get('value', ''))
+
+    # If default legends exist, remove them
+    p.legend.visible = False
+    p.legend.clear()
+
+    # Create new legend items
+    items = [LegendItem(label=label, renderers=[rend]) for label, rend in zip(labels, renderers)]
+
+    # Create new legend manually
+    new_legend = Legend(
+        items=items,
+        orientation='horizontal',
+        location='center',
+        background_fill_color='white',
+        background_fill_alpha=1.0,
+        border_line_color='black',
+        label_text_color='black',
+        label_text_font_size='12pt',
+        spacing=5,
+        margin=10,
+        label_standoff=5,
+        glyph_width=20,
+        glyph_height=20,
+        columns=8  # Distribute across columns
+    )
+
+    # Attach it below the plot area
+    p.add_layout(new_legend, 'below')
+
+
 def hook1(plot, element):
     plot.handles['xaxis'].axis_label_text_color = 'black'
     plot.handles['yaxis'].axis_label_text_color = 'black'
@@ -419,12 +465,12 @@ def create_overlay_plots(df):
     overlay = hv.Overlay(curves).opts(
     opts.Overlay(bgcolor='white',
             #padding=-0.1,
-            show_legend=True,
+            show_legend=False,
             #legend_position='top_left',
             #ylim=(0, max_y + 0.18*max_y),
             width=1700,
             height=500,
-            hooks=[legend_hook, hook1, lambda p, _: p.state.update(border_fill_color='white')],
+            hooks=[custom_legend_below, hook1, lambda p, _: p.state.update(border_fill_color='white')],
 
     ),
     opts.Curve(