add RangeSlider

app.py

@@ -12,6 +12,7 @@ import numpy as np
 from huggingface_hub import HfApi
 from huggingface_hub.hf_api import HTTPError
 from huggingface_hub.utils._errors import GatedRepoError
+from gradio_rangeslider import RangeSlider
 
 
 load_dotenv()
@@ -143,6 +144,7 @@ def update_table(period: str,
                  metric: str,
                  visible_columns: list,
                  color_columns: list,
+                 size_range: list,
                  sort_by: str = 'Average (The lower the better)',
                  ascending: bool = True):
     target_data = all_data[period]
@@ -153,6 +155,9 @@ def update_table(period: str,
         combined_data = pd.concat([target_data[model][target_metric] for model in target_model_size], axis=0)
         combined_data['Name'] = combined_data['Name'].apply(lambda x: x.replace('.pth', ''))
 
+        # Filter models based on the size range
+        combined_data = combined_data[combined_data['Parameters Count (B)'].between(size_range[0], size_range[1])]
+
         combined_data.reset_index(drop=True, inplace=True)
 
         if 'Average (The lower the better)' in combined_data.columns:
@@ -360,7 +365,8 @@ initial_models = model_size_list
 initial_metric = metric_list[0]
 initial_columns = get_unique_column_names(all_data)
 initial_colors = ['Average']
-initial_data = update_table(initial_period, initial_models, initial_metric, initial_columns, initial_colors)
+initial_size_range = [0, 15]
+initial_data = update_table(initial_period, initial_models, initial_metric, initial_columns, initial_colors, initial_size_range)
 
 css = '''
 .gradio-container {
@@ -387,7 +393,8 @@ with gr.Blocks(css=css) as demo:
             with gr.Row():
                 with gr.Column():
                     period_selector = gr.Dropdown(label="Period", choices=time_list, value=last_period)
-                    model_selector = gr.CheckboxGroup(label="Model", choices=model_size_list, value=model_size_list)
+                    model_selector = gr.CheckboxGroup(label="Model Size", choices=model_size_list, value=model_size_list)
+                    size_range_slider = RangeSlider(minimum=0, maximum=15, value=[0, 15], step=0.1, label="Model Size Range")
                     metric_selector = gr.Dropdown(label="Metric", choices=metric_list, value=metric_list[0])
                 with gr.Column():
                     color_selector = gr.CheckboxGroup(label="Colored Columns",
@@ -403,20 +410,23 @@ with gr.Blocks(css=css) as demo:
                                  )
 
             period_selector.change(update_table,
-                                   inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector],
+                                   inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector, size_range_slider],
                                    outputs=table)
             model_selector.change(update_table,
-                                  inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector],
+                                  inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector, size_range_slider],
                                   outputs=table)
             metric_selector.change(update_table,
-                                   inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector],
+                                   inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector, size_range_slider],
                                    outputs=table)
             colfilter.change(update_table,
-                             inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector],
+                             inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector, size_range_slider],
                              outputs=table)
             color_selector.change(update_table,
-                                  inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector],
+                                  inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector, size_range_slider],
                                   outputs=table)
+            size_range_slider.change(update_table,
+                                    inputs=[period_selector, model_selector, metric_selector, colfilter, color_selector, size_range_slider],
+                                    outputs=table)
 
         with gr.Tab("🌍 MultiLang"):
             gr.Markdown("## Coming soon...")