Update app.py

app.py

@@ -1,6 +1,5 @@
 import gradio as gr
 import pandas as pd
-import plotly.express as px
 from dataclasses import dataclass, field
 from typing import List, Dict, Tuple, Union
 import json
@@ -8,6 +7,10 @@ import os
 from collections import OrderedDict
 import re
 
+import plotly.graph_objects as go
+import plotly.express as px
+# from plotly.subplots import make_subplots
+# import math
 
 def load_css(css_file_path):
     """Load CSS from a file."""
@@ -486,66 +489,208 @@ with gr.Column(visible=True) as leaderboard_tab:
         datatype=["markdown", "markdown", "markdown"] + ["markdown"] * (len(category_choices)+1)  # Support markdown in all columns
     )
 
+def hex_to_rgba(hex_color, alpha):
+    """Convert hex color to rgba string with given alpha value."""
+    hex_color = hex_color.lstrip('#')
+    r = int(hex_color[:2], 16)
+    g = int(hex_color[2:4], 16)
+    b = int(hex_color[4:], 16)
+    return f'rgba({r},{g},{b},{alpha})'
+
 def create_category_chart(selected_systems, selected_categories):
     if not selected_systems:
-        # Create an empty figure with a prompt message
-        df = pd.DataFrame({'AI System': [], 'Category': [], 'Evaluations Completed': []})
-        fig = px.bar(df, 
-                    x='AI System',
-                    y='Evaluations Completed',
-                    title='Please select at least one AI system for comparison')
-        fig.update_layout(showlegend=True)
+        fig = go.Figure()
+        fig.add_annotation(
+            text="Please select at least one AI system for comparison",
+            xref="paper", yref="paper",
+            x=0.5, y=0.5,
+            showarrow=False
+        )
         return fig
     
-    # Sort categories before processing
     selected_categories = sort_categories(selected_categories)
+    BASE_SCORE = 5
     
-    data = []
+    # Prepare all data first
+    all_data = []
     for system_name in selected_systems:
+        system_data = []
         for category in selected_categories:
             if category in models[system_name]['scores']:
                 completed = 0
                 total = 0
+                category_name = category.split('.')[1].strip()
                 
+                all_na = True
                 for section in models[system_name]['scores'][category].values():
                     if section['status'] != 'N/A':
+                        all_na = False
                         questions = section.get('questions', {})
                         completed += sum(1 for q in questions.values() if q)
                         total += len(questions)
                 
-                if total > 0:  # Only add if there are evaluations to do
-                    data.append({
-                        'AI System': system_name,
-                        'Category': category.split('.')[1].strip(),
-                        'Evaluations Completed': completed,
-                        'Total Evaluations': total
-                    })
-    
-    df = pd.DataFrame(data)
+                if all_na:
+                    score = BASE_SCORE
+                    display_score = 0
+                    status = 'N/A'
+                elif total > 0:
+                    raw_score = (completed / total) * 100
+                    score = BASE_SCORE + (90 * raw_score / 100)
+                    display_score = raw_score
+                    status = 'Active'
+                else:
+                    score = BASE_SCORE
+                    display_score = 0
+                    status = 'Active'
+                
+                system_data.append({
+                    'AI System': system_name,
+                    'Category': category_name,
+                    'Score': score,
+                    'Display Score': display_score,
+                    'Status': status,
+                    'Original Score': f"{display_score:.1f}%",
+                    'Completed': completed,
+                    'Total': total
+                })
+        if system_data:
+            # Add first point again to close the shape
+            system_data.append(system_data[0].copy())
+            all_data.extend(system_data)
+    
+    df = pd.DataFrame(all_data)
     
     if df.empty:
-        fig = px.bar(title='No data available for the selected AI systems and categories')
-    else:
-        fig = px.bar(
-            df,
-            x='AI System',
-            y='Evaluations Completed',
-            color='Category',
-            title='Number of Evaluations Completed by Category',
-            labels={
-                'Evaluations Completed': 'Evaluations Completed',
-                'AI System': 'AI System Name',
-                'Category': 'Evaluation Category'
-            },
-            hover_data=['Total Evaluations']
+        fig = go.Figure()
+        fig.add_annotation(
+            text="No data available for the selected AI systems and categories",
+            xref="paper", yref="paper",
+            x=0.5, y=0.5,
+            showarrow=False
         )
+        return fig
+    
+    fig = go.Figure()
+    
+    # Define colors
+    colors = [
+        '#FF4B4B', '#4B7BFF', '#4BFF4B', '#FFD700', '#FF4BFF',
+        '#4BFFFF', '#FF884B', '#884BFF', '#4BFF88', '#FFFF4B'
+    ]
+    
+    # Calculate average scores for sorting
+    system_scores = {
+        system: df[df['AI System'] == system]['Score'].mean()
+        for system in selected_systems
+    }
+    sorted_systems = sorted(selected_systems, 
+                          key=lambda x: system_scores[x], 
+                          reverse=True)
+    
+    # Plot each system
+    for idx, system_name in enumerate(sorted_systems):
+        system_df = df[df['AI System'] == system_name]
         
-        fig.update_layout(
-            showlegend=True,
-            xaxis_title="AI System Name",
-            yaxis_title="Number of Evaluations Completed",
-            # hovermode='x unified'
-        )
+        # Get color for this system
+        base_color = colors[idx % len(colors)]
+        line_color = hex_to_rgba(base_color, 0.9)
+        fill_color = hex_to_rgba(base_color, 0.15)
+        hover_color = hex_to_rgba(base_color, 1.0)
+        
+        # First, add the complete shape with all points (including N/A)
+        fig.add_trace(go.Scatterpolar(
+            r=system_df['Score'].tolist(),
+            theta=system_df['Category'].tolist(),
+            name=system_name,
+            fill='toself',
+            line=dict(color=line_color),
+            fillcolor=fill_color,
+            hoverinfo='skip',  # Disable hover for the shape trace
+            showlegend=True
+        ))
+        
+        # Then add separate trace for hover information on non-N/A points
+        non_na_df = system_df[system_df['Status'] != 'N/A']
+        if not non_na_df.empty:
+            fig.add_trace(go.Scatterpolar(
+                r=non_na_df['Score'].tolist(),
+                theta=non_na_df['Category'].tolist(),
+                mode='markers',
+                marker=dict(size=1, color='rgba(0,0,0,0)'),  # Nearly invisible markers
+                customdata=list(zip(
+                    non_na_df['Original Score'],
+                    non_na_df['Status'],
+                    non_na_df['Completed'],
+                    non_na_df['Total']
+                )),
+                hovertemplate=(
+                f"<span style='background-color: {hover_color}; color: white; padding: 10px; display: block'>" +
+                "<b>%{theta}</b><br>" +
+                f"AI System: {system_name}<br>" +
+                "Score: %{customdata[0]}<br>" +
+                "Status: %{customdata[1]}<br>" +
+                "Evaluations completed: %{customdata[2]}/%{customdata[3]}" +
+                "</span>" +
+                "<extra></extra>"),
+                showlegend=False
+            ))
+        
+        # Finally add N/A markers
+        na_df = system_df[system_df['Status'] == 'N/A']
+        if not na_df.empty:
+            fig.add_trace(go.Scatterpolar(
+                r=na_df['Score'].tolist(),
+                theta=na_df['Category'].tolist(),
+                mode='markers+lines',
+                line=dict(color='rgba(128, 128, 128, 0.3)', dash='dot'),
+                marker=dict(color='rgba(128, 128, 128, 0.3)', size=8),
+                customdata=list(zip(
+                    na_df['Original Score'],
+                    na_df['Status'],
+                    na_df['Completed'],
+                    na_df['Total']
+                )),
+                hovertemplate="<b>%{theta}</b><br>" +
+                            f"AI System: {system_name}<br>" +
+                            "Status: N/A<br>" +
+                            "Evaluations completed: %{customdata[2]}/%{customdata[3]}<br>" +
+                            "<extra></extra>",
+                showlegend=False
+            ))
+    
+    # Update layout
+    fig.update_layout(
+        polar=dict(
+            radialaxis=dict(
+                visible=True,
+                range=[0, 100],
+                ticksuffix='%',
+                showline=True,
+                linewidth=1,
+                gridwidth=1,
+                gridcolor='rgba(0,0,0,0.1)',
+                ticktext=[f'{i}%' for i in range(0, 101, 20)],
+                tickvals=list(range(0, 101, 20))
+            ),
+            angularaxis=dict(
+                gridcolor='rgba(0,0,0,0.1)',
+                linecolor='rgba(0,0,0,0.1)',
+            )
+        ),
+        showlegend=True,
+        title=dict(
+            text='Category Completion Rates by AI System',
+            x=0.5,
+            xanchor='center'
+        ),
+        legend=dict(
+            yanchor="top",
+            y=1.2,
+            xanchor="left",
+            x=1.1
+        ),
+        margin=dict(t=100, b=100, l=100, r=100)
+    )
     
     return fig