Adding a simple gradio code for creating a leaderboard

#1
by michaelsh - opened
import gradio as gr
import plotly.graph_objects as go
import numpy as np
import pandas as pd


def create_sota_plot():
    # State-of-the-art models data
    sota_models = {
        'SIFT + FVs': (2012, 53),
        'AlexNet': (2012.5, 65),
        'SPPNet': (2014.5, 74),
        'Inception V3': (2015.5, 81),
        'NASNET-A(6)': (2017, 82.7),
        'CoAtNet-7': (2021.5, 90.88),
        '': (2022, 87.79),  # Last point
        '': (2022.2, 87.73)  # Final value shown
    }

    # Extract data for SOTA models
    sota_years = [year for year, _ in sota_models.values() if year != '']
    sota_accuracy = [acc for _, acc in sota_models.values() if acc != '']
    sota_labels = [name for name in sota_models.keys() if name != '']

    # Generate synthetic "other models" data (gray points)
    np.random.seed(42)
    n_other = 300
    other_years = np.random.uniform(2010, 2023, n_other)
    # Create a distribution that's mostly below SOTA but with some variance
    other_accuracy = []
    for year in other_years:
        # Find approximate SOTA accuracy for this year
        sota_at_year = np.interp(year, sota_years[:len(sota_accuracy)], sota_accuracy[:len(sota_accuracy)])
        # Add models mostly below SOTA with some variance
        if year < 2012:
            acc = np.random.normal(45, 8)
        else:
            acc = np.random.normal(sota_at_year - 10, 5)
            # Some models can be close to SOTA
            if np.random.random() < 0.1:
                acc = sota_at_year - np.random.uniform(0, 3)
        other_accuracy.append(max(30, min(92, acc)))  # Clip to reasonable range

    # Create the plot
    fig = go.Figure()

    # Add other models (gray scatter points)
    fig.add_trace(go.Scatter(
        x=other_years,
        y=other_accuracy,
        mode='markers',
        name='Other models',
        marker=dict(
            color='lightgray',
            size=6,
            opacity=0.5
        ),
        hovertemplate='Year: %{x:.1f}<br>Accuracy: %{y:.1f}%<extra></extra>'
    ))

    # Add SOTA models line
    fig.add_trace(go.Scatter(
        x=sota_years[:len(sota_accuracy)],
        y=sota_accuracy,
        mode='lines+markers',
        name='State-of-the-art models',
        line=dict(color='#00CED1', width=3),
        marker=dict(size=10, color='#00CED1'),
        hovertemplate='%{text}<br>Year: %{x:.1f}<br>Accuracy: %{y:.1f}%<extra></extra>',
        text=sota_labels[:len(sota_accuracy)]
    ))

    # Add labels for SOTA models
    for i, (name, (year, acc)) in enumerate(sota_models.items()):
        if name and i < len(sota_accuracy):  # Only label points with names
            fig.add_annotation(
                x=year,
                y=acc,
                text=name,
                showarrow=False,
                yshift=15,
                font=dict(size=12)
            )

    # Add the final accuracy values
    fig.add_annotation(
        x=2022,
        y=87.79,
        text="87.79",
        showarrow=False,
        xshift=30,
        font=dict(size=12, weight='bold')
    )

    fig.add_annotation(
        x=2022.2,
        y=87.73,
        text="87.73",
        showarrow=False,
        xshift=30,
        yshift=-10,
        font=dict(size=12)
    )

    # Update layout
    fig.update_layout(
        title='Evolution of Model Performance on ImageNet',
        xaxis_title='Year',
        yaxis_title='TOP-1 ACCURACY',
        xaxis=dict(
            range=[2010, 2023],
            tickmode='linear',
            tick0=2012,
            dtick=2,
            showgrid=True,
            gridcolor='lightgray'
        ),
        yaxis=dict(
            range=[35, 100],
            tickmode='linear',
            tick0=40,
            dtick=10,
            showgrid=True,
            gridcolor='lightgray'
        ),
        plot_bgcolor='white',
        paper_bgcolor='white',
        height=500,
        legend=dict(
            yanchor="bottom",
            y=0.01,
            xanchor="center",
            x=0.5,
            orientation="h"
        )
    )

    return fig


# Create Gradio interface
with gr.Blocks(theme=gr.themes.Soft()) as demo:
    gr.Markdown("# State-of-the-Art Models Timeline")
    gr.Markdown(
        "This visualization shows the evolution of state-of-the-art models' performance over time, similar to the ImageNet benchmark progression.")

    plot = gr.Plot(label="Model Performance Evolution")

    # Create plot on load
    demo.load(fn=create_sota_plot, outputs=plot)

    # Add interactive controls
    with gr.Row():
        refresh_btn = gr.Button("Refresh Plot")

    refresh_btn.click(fn=create_sota_plot, outputs=plot)

    gr.Markdown("""
    ### About this visualization:
    - **Cyan line**: State-of-the-art models showing the progression of best performance
    - **Gray dots**: Other models representing the broader research landscape
    - The plot shows how breakthrough models like AlexNet, Inception, and NASNET pushed the boundaries
    - Notice the rapid improvement from 2012-2018, followed by more incremental gains
    """)

if __name__ == "__main__":
    demo.launch()

@nielsr I paste a sample code that create a graph that similar to PwC in gradio.
What do you think?

paperswithcode Archive org

Sure perhaps you can create a Space for this to showcase how the app looks like.

again it's only a draft

paperswithcode Archive org

Would be cool to leverage the actual data PwC released, rather than some dummy data

@nielsr do you understand the structure of PwC data?

paperswithcode Archive org

This looks pretty cool! It is based on the PwC data dump?

Sign up or log in to comment