Update app.py

app.py

@@ -54,17 +54,14 @@ def apply_custom_styling():
         html, body, [class*="st-"] {
             font-family: 'Roboto', sans-serif;
         }
-
         .stApp {
             background-color: rgb(28, 28, 28);
             color: white;
         }
-
         /* Tab styles */
         .stTabs [data-baseweb="tab-list"] {
             gap: 24px;
         }
-
         .stTabs [data-baseweb="tab"] {
             height: 50px;
             white-space: pre-wrap;
@@ -79,7 +76,6 @@ def apply_custom_styling():
             background: #222;
             color: #FFF;
         }
-
         .stTabs [aria-selected="true"] {
             border-bottom: 2px solid #00A0FF; /* Highlight color for active tab */
             color: #FFF;
@@ -96,7 +92,6 @@ def apply_custom_styling():
             color: #FFF;
             background-color: #00A0FF;
         }
-
         </style>
         """,
         unsafe_allow_html=True
@@ -258,8 +253,8 @@ def plot_properties_dashboard(df: pd.DataFrame):
     colors = ['#00D4AA', '#FF6B6B']  # Teal for drug-like, coral for non-drug-like
     color_mapper = factor_cmap('Category', palette=colors, factors=["Drug-Like", "Non-Drug-Like"])
     
-    # Enhanced hover tooltip
-    hover = HoverTool(tooltips=[
+    # Enhanced hover tooltip for scatter plots
+    scatter_hover = HoverTool(tooltips=[
         ("Compound", "@Molecule"),
         ("MW", "@MW{0.0} Da"),
         ("LogP", "@LogP{0.00}"),
@@ -269,10 +264,10 @@ def plot_properties_dashboard(df: pd.DataFrame):
         ("Category", "@Category")
     ])
     
-    # Common plot configuration - responsive plots with no background fill
+    # Common plot configuration - responsive plots with a 1:1 aspect ratio
     plot_config = {
-        'tools': [hover, 'pan,wheel_zoom,box_zoom,reset,save'],
         'sizing_mode': 'scale_width', 
+        'aspect_ratio': 1,  # Enforce a square aspect ratio for the data area
         'background_fill_color': None,
         'border_fill_color': None, 
         'outline_line_color': '#333333',
@@ -313,7 +308,7 @@ def plot_properties_dashboard(df: pd.DataFrame):
         return p
 
     # Plot 1: MW vs LogP with Lipinski guidelines
-    p1 = figure(title="Molecular Weight vs LogP", **plot_config)
+    p1 = figure(title="Molecular Weight vs LogP", tools=[scatter_hover, 'pan,wheel_zoom,box_zoom,reset,save'], **plot_config)
     p1.scatter('MW', 'LogP', source=source, legend_group='Category', 
                color=color_mapper, size=12, alpha=0.8, line_color='white', line_width=0.5)
     
@@ -326,7 +321,7 @@ def plot_properties_dashboard(df: pd.DataFrame):
     style_plot(p1, "Molecular Weight (Da)", "LogP", "Lipinski Rule: MW vs LogP")
 
     # Plot 2: HBD vs HBA
-    p2 = figure(title="Hydrogen Bonding Profile", **plot_config)
+    p2 = figure(title="Hydrogen Bonding Profile", tools=[scatter_hover, 'pan,wheel_zoom,box_zoom,reset,save'], **plot_config)
     p2.scatter('HBD', 'HBA', source=source, legend_group='Category',
                color=color_mapper, size=12, alpha=0.8, line_color='white', line_width=0.5)
     
@@ -338,9 +333,8 @@ def plot_properties_dashboard(df: pd.DataFrame):
     
     style_plot(p2, "Hydrogen Bond Donors", "Hydrogen Bond Acceptors", "Lipinski Rule: Hydrogen Bonding")
 
-    # --- MODIFICATION ---
     # Plot 3: TPSA vs Rotatable Bonds with guidelines
-    p3 = figure(title="Molecular Flexibility & Polarity", **plot_config)
+    p3 = figure(title="Molecular Flexibility & Polarity", tools=[scatter_hover, 'pan,wheel_zoom,box_zoom,reset,save'], **plot_config)
     p3.scatter('TPSA', 'RotBonds', source=source, legend_group='Category',
                color=color_mapper, size=12, alpha=0.8, line_color='white', line_width=0.5)
     
@@ -353,8 +347,11 @@ def plot_properties_dashboard(df: pd.DataFrame):
     style_plot(p3, "Topological Polar Surface Area (Ų)", "Rotatable Bonds", "Drug Permeability Indicators")
 
     # Plot 4: Enhanced Donut Chart
+    # --- MODIFICATION ---
+    # Configure donut plot separately as it doesn't need all scatter tools
     p4_config = plot_config.copy()
-    p4_config.update({'tools': "hover", 'x_range': (-1.0, 1.0), 'y_range': (-1.0, 1.0)})
+    p4_config['tools'] = "hover" # Only need hover for the donut
+    p4_config.update({'x_range': (-1.0, 1.0), 'y_range': (-1.0, 1.0)})
     p4 = figure(title="Drug-Likeness Distribution", **p4_config)
     
     # Calculate percentages and create donut chart
@@ -363,7 +360,7 @@ def plot_properties_dashboard(df: pd.DataFrame):
     data = pd.DataFrame({
         'category': counts.index,
         'value': counts.values,
-        'percentage': (counts.values / total * 100).round(1),
+        'percentage': (counts.values / total * 100), # Keep full precision for hover
         'angle': counts.values / total * 2 * pi,
         'color': [colors[0] if cat == 'Drug-Like' else colors[1] for cat in counts.index]
     })
@@ -380,7 +377,7 @@ def plot_properties_dashboard(df: pd.DataFrame):
     donut_source = ColumnDataSource(data)
     
     # Create donut using annular wedges (outer ring) - sized to fit within boundaries
-    p4.annular_wedge(x=0, y=0, inner_radius=0.25, outer_radius=0.45,
+    wedge_renderer = p4.annular_wedge(x=0, y=0, inner_radius=0.25, outer_radius=0.45,
                      start_angle='start_angle', end_angle='end_angle',
                      line_color="white", line_width=3, fill_color='color', 
                      legend_field='category', source=donut_source)
@@ -403,10 +400,17 @@ def plot_properties_dashboard(df: pd.DataFrame):
             text_align="center", text_baseline="middle", 
             text_color="white", text_font_size="14pt", text_font_style="bold")
     
-    # Custom hover for donut
-    p4.add_tools(HoverTool(tooltips=[("Category", "@category"), 
-                                     ("Count", "@value"), 
-                                     ("Percentage", "@percentage{0.0}%")]))
+    # --- MODIFICATION ---
+    # Custom hover for donut with detailed info
+    donut_hover = HoverTool(
+        tooltips=[
+            ("Category", "@category"), 
+            ("Count", "@value"), 
+            ("Percentage", "@percentage{0.1f}%")
+        ],
+        renderers=[wedge_renderer] # Attach hover tool specifically to the wedge glyph
+    )
+    p4.add_tools(donut_hover)
     
     style_plot(p4, "", "", "Compound Classification")
     p4.axis.visible = False