demo.py

import gradio as gr
import pandas as pd

from math import ceil

from gradio_function import player_df, jp_pitch_to_en_pitch, get_data
from translate import max_pitch_types


with gr.Blocks(fill_height=True) as demo:
  gr.Markdown('''
  # NPB data visualization demo
  [Data from SportsNavi](https://sports.yahoo.co.jp/)
  ''')
  player = gr.Dropdown(choices=sorted(player_df['name'].dropna().tolist()), label='Player')
  player_info = gr.Markdown()
  gr.Markdown('## Pitch Distribution')
  usage = gr.Plot(label='Pitch Distribution')

  max_pitch_maps = len(jp_pitch_to_en_pitch)
  pitch_maps_per_row = 3
  max_rows = ceil(max_pitch_maps/pitch_maps_per_row)

  gr.Markdown('## Pitch Locations')
  pitch_names = []
  pitch_infos = []
  pitch_maps = []
  # default_pitch_info = [
  #     ('Whiff%', None),
  #     ('CSW%', None)
  # ]
  for row in range(max_rows):
    with gr.Row():
      _pitch_maps_per_row = pitch_maps_per_row if row < max_rows-1 else max_pitch_maps % pitch_maps_per_row
      for col in range(_pitch_maps_per_row):
        with gr.Column():
          pitch_names.append(gr.Markdown(f'### Pitch {col+1}', visible=(row==0)))
          pitch_infos.append(gr.DataFrame(pd.DataFrame([{'Whiff%': None, 'CSW%': None}]), interactive=False, visible=(row==0)))
          # pitch_infos.append(gr.DataFrame(default_pitch_info, headers=None, visible=(row==0)))
          pitch_maps.append(gr.Plot(label='Pitch location', visible=(row==0)))

  gr.Markdown('## Bugs and other notes')
  with gr.Accordion('Click to open', open=False):
    gr.Markdown('''
    - The bottommost level of the pitch heat maps are not transparent even though they should be. Works on Google Colab but not when I put everything in a `.py` file it doesn't work.
    - CSW% has not been verified
    '''
    )

  player.input(get_data, inputs=player, outputs=[player_info, usage, *pitch_names, *pitch_infos, *pitch_maps])

demo.launch(
    share=True
)