| import gradio as gr |
| import plotly.express as px |
| import numpy as np |
| import math |
|
|
| def generate_chart(idx): |
| x = np.arange(10) |
| y = np.random.randint(0, 100, size=10) |
| return px.line(x=x, y=y, markers=True, title=f"Chart {idx+1}") |
|
|
| def update_dashboard(num_charts, num_cols): |
| num_charts, num_cols = int(num_charts), int(num_cols) |
|
|
| charts = [generate_chart(i) for i in range(num_charts)] |
|
|
| updates = [] |
| |
| for fig in charts: |
| updates.append(gr.update(value=fig, visible=True)) |
| |
| for i in range(len(charts), max_slots): |
| updates.append(gr.update(value=None, visible=False)) |
|
|
| return updates |
|
|
| max_slots = 20 |
|
|
| with gr.Blocks() as demo: |
| with gr.Row(): |
| num_charts = gr.Number(label="Number of Charts", value=17, precision=0) |
| num_cols = gr.Number(label="Number of Columns", value=4, precision=0, interactive=False, visible=False) |
| num_cols_per_row = 4 |
| num_cols_state = gr.State(num_cols_per_row) |
| btn = gr.Button("Generate Dashboard") |
|
|
| chart_slots = [] |
| rows = math.ceil(max_slots / num_cols_per_row) |
| for r in range(rows): |
| with gr.Row(): |
| for c in range(num_cols_per_row): |
| chart_slots.append(gr.Plot(visible=False)) |
|
|
| btn.click(update_dashboard, [num_charts, num_cols], chart_slots) |
| def on_num_cols_change(evt): |
| print(evt) |
| return evt |
| num_cols.change(on_num_cols_change, inputs=[num_cols],outputs=[num_cols_state]) |
|
|
| demo.launch() |
|
|
