File size: 2,930 Bytes
94f5248
 
5608218
94f5248
5608218
 
 
94f5248
de0a7e9
 
 
 
5608218
de0a7e9
 
 
 
 
5608218
 
 
94f5248
5608218
 
 
 
 
 
94f5248
 
db6c19e
 
 
 
 
 
 
 
 
 
 
 
 
7f53290
de0a7e9
 
db6c19e
de0a7e9
 
db6c19e
 
 
 
de0a7e9
db6c19e
 
 
de0a7e9
bd80b61
7f53290
bd80b61
 
7f53290
de0a7e9
 
 
7e7ba0a
7f53290
94f5248
5608218
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
import gradio as gr
import os
from PIL import Image

# Paths to the images folder
RAW_PATH = os.path.join("images", "raw")
EMBEDDINGS_PATH = os.path.join("images", "embeddings")

# Specific values for percentage and complexity
percentage_values = [10, 30, 50, 70, 100]
complexity_values = [16, 32]

# Function to load and display images based on user selection
def display_images(percentage_idx, complexity_idx):
    # Map the slider index to the actual value
    percentage = percentage_values[percentage_idx]
    complexity = complexity_values[complexity_idx]
    
    # Generate the paths to the images
    raw_image_path = os.path.join(RAW_PATH, f"percentage_{percentage}_complexity_{complexity}.png")
    embeddings_image_path = os.path.join(EMBEDDINGS_PATH, f"percentage_{percentage}_complexity_{complexity}.png")
    
    # Load images using PIL
    raw_image = Image.open(raw_image_path)
    embeddings_image = Image.open(embeddings_image_path)
    
    # Return the loaded images
    return raw_image, embeddings_image

# Define the Gradio interface
with gr.Blocks(css="""
    .vertical-slider input[type=range] {
        writing-mode: bt-lr; /* IE */
        -webkit-appearance: slider-vertical; /* WebKit */
        width: 8px;
        height: 200px;
    }
    .slider-container {
        display: inline-block;
        margin-right: 50px;
        text-align: center;
    }
""") as demo:
    gr.Markdown("# Raw vs. Embeddings Inference Results")
    gr.Markdown("Use the sliders to adjust the percentage of data for training and task complexity.")

    # Layout for vertical side-by-side sliders (using CSS to rotate sliders)
    with gr.Row():
        # Column for percentage slider
        with gr.Column(elem_id="slider-container"):
            gr.Markdown("Percentage of Data for Training")
            percentage_slider = gr.Slider(minimum=0, maximum=4, step=1, value=0, interactive=True, elem_id="vertical-slider")

        # Column for complexity slider
        with gr.Column(elem_id="slider-container"):
            gr.Markdown("Task Complexity")
            complexity_slider = gr.Slider(minimum=0, maximum=1, step=1, value=0, interactive=True, elem_id="vertical-slider")

    # Outputs (display the images side by side and set a smaller size for the images)
    with gr.Row():
        raw_img = gr.Image(label="Raw Channels", type="pil", width=300, height=300, interactive=False)  # Smaller image size
        embeddings_img = gr.Image(label="Embeddings", type="pil", width=300, height=300, interactive=False)  # Smaller image size
    
    # Trigger image updates when sliders change
    percentage_slider.change(fn=display_images, inputs=[percentage_slider, complexity_slider], outputs=[raw_img, embeddings_img])
    complexity_slider.change(fn=display_images, inputs=[percentage_slider, complexity_slider], outputs=[raw_img, embeddings_img])

# Launch the app
if __name__ == "__main__":
    demo.launch()