app.py

import gradio as gr
from gradio_folium import Folium
from folium import Map, TileLayer
import pandas as pd

# Sample data for demonstration
data = {
    "topo_start_lat": [37.7749, 40.7128],
    "topo_start_lon": [-122.4194, -74.0060],
    "city": ["San Francisco", "New York"]
}
df = pd.DataFrame(data)

def select(data, event):
    index = event.index[0]
    row = df.iloc[index]
    return Map(
        location=[row['topo_start_lat'], row['topo_start_lon']],
        zoom_start=10,
  
    )

with gr.Blocks() as demo:
    gr.Markdown("# Explore World Capitals with Gradio and Folium")
    map_component = Folium(value=Map(location=[0, 0], zoom_start=2))
    data_table = gr.DataFrame(value=df)
    data_table.select(select, inputs=data_table, outputs=map_component)


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