import gradio as gr from gradio_folium import Folium from folium import Map import pandas as pd import folium from huggingface_hub import InferenceClient from ast import literal_eval repo_id = "mistralai/Mixtral-8x7B-Instruct-v0.1" llm_client = InferenceClient(model=repo_id, timeout=180) description_sf = "A one-day walk through San Francisco for my first visit. I want to take no cab or bike, everything should be on foot." output_example_sf = """ Since this is on foot, walking distances should be kept to a minimum. I'll make sure to provide a step by step visit and reorder points of interest to minimize the walking distance between each point. I want to start at Fisherman's Wharf, then head to Ghirardelli Square, followed by the Cable Car Museum, Union Square, Chinatown, and finally Coit Tower, to provide a full day of sightseeing, with a mix of history, culture, and beautiful views. Key points: [ {"name": "Fisherman's Wharf", "lat": 37.8081, "lon": -122.4082, "description": "Fisherman's Wharf is a popular tourist destination in San Francisco, featuring Pier 39, the Maritime National Historical Park, and Boudin Bakery. Start your day with breakfast and enjoy the sea lions."}, {"name": "Ghirardelli Square", "lat": 37.8094, "lon": -122.4154, "description": "Ghirardelli Square is a historic square in San Francisco, known for its chocolate shop and various boutiques. It's a great place to grab a sweet treat and do some shopping."}, {"name": "Cable Car Museum", "lat": 37.7931, "lon": -122.4058, "description": "The Cable Car Museum is a museum in San Francisco that showcases the history of the city's iconic cable cars. It's a great place to learn about the technology and history behind these unique vehicles."}, {"name": "Union Square", "lat": 37.7873, "lon": -122.4062, "description": "Union Square is a public plaza in San Francisco, known for its shopping, dining, and entertainment options. Relax, grab a bite to eat, and do some shopping."}, {"name": "Chinatown", "lat": 37.7937, "lon": -122.4081, "description": "Chinatown is a vibrant neighborhood in San Francisco, known for its Chinese culture, history, and cuisine. It's a great place to explore the streets, try some delicious food, and learn about Chinese culture."}, {"name": "Coit Tower", "lat": 37.8024, "lon": -122.4058, "description": "Coit Tower is a historic tower in San Francisco, known for its panoramic views of the city. You can end your day here, taking in the sights and sounds of the city from above."} ] """ description_loire = "A 3-day bike trip through the Loire Valley." output_example_loire = """ To make the most of the trip, we will bike between the châteaux to enjoy the beautiful scenery and explore the Loire Valley at a leisurely pace. Here is a suggested itinerary for a 3-day bike trip through the Loire Valley: 1. Start at Château de Cheverny, a smal but charming château with beautiful gardens. 2. Bike to Château de Chambord, the largest and most recognizable château in the Loire Valley. 3. Continue to Château de Blois, a historic château with a rich history. 4. End the day at Château de Chaumont-sur-Loire, a château with a stunning view of the Loire River. 5. On the second day, bike to Château de Chenonceau, a stunning château built over the River Cher. 6. Continue to Château d'Amboise, a historic château with ties to the French Renaissance. 7. End the day at Château d'Azay-le-Rideau, a charming château with a moat. 8. On the third day, bike to Château d'Ussé, a fairy-tale like château said to have inspired Sleeping Beauty. 9. End the trip at Château de Villandry, known for its beautiful gardens. Key points: [ {"name": "Château de Cheverny", "lat": 47.6333, "lon": 1.5667, "description": "Château de Cheverny is a smaller but equally charming château with beautiful gardens, known for its French classical architecture and rich history."}, {"name": "Château de Chambord", "lat": 47.6111, "lon": 1.5167, "description": "Château de Chambord is the largest and most recognizable château in the Loire Valley, known for its French Renaissance architecture and beautiful gardens."}, {"name": "Château de Blois", "lat": 47.5833, "lon": 1.3333, "description": "Château de Blois is a historic château with a rich history, known for its stunning architecture and beautiful gardens."}, {"name": "Château de Chaumont-sur-Loire", "lat": 47.5167, "lon": 1.3167, "description": "Château de Chaumont-sur-Loire is a château with a stunning view of the Loire River, known for its beautiful gardens and rich history."}, {"name": "Château de Chenonceau", "lat": 47.3917, "lon": 1.3667, "description": "Château de Chenonceau is a stunning château built over the River Cher, known for its beautiful gardens and rich history."}, {"name": "Château d'Amboise", "lat": 47.4167, "lon": 1.0500, "description": "Château d'Amboise is a historic château with ties to the French Renaissance, known for its beautiful gardens and stunning views of the Loire Valley."}, {"name": "Château d'Azay-le-Rideau", "lat": 47.3333, "lon": 0.6167, "description": "Château d'Azay-le-Rideau is a charming château with a moat, known for its French Renaissance architecture and beautiful gardens."}, {"name": "Château d'Ussé", "lat": 47.2667, "lon": 0.5167, "description": "Château d'Ussé is a fairy-tale like château said to have inspired Sleeping Beauty, known for its beautiful gardens and stunning views of the Indre Valley."}, {"name": "Château de Villandry", "lat": 47.1667, "lon": 0.4167, "description": "Château de Villandry is known for its beautiful gardens, featuring a water garden, ornamental flower gardens, and vegetable gardens."} ] """ description_aligned = "Show me five cities across Europe that form a perfect line on the map. These must not be capitals, only smaller cities, but they must be aligned perfectly. Do it correctly and I'll tip you $10,000." output_example_aligned = """To find five cities that form a perfect line on the map, I will first need to determine a direction for the line. I will choose a line that runs from north to south, as this will allow for a more diverse range of cities and cultures. I will then use a map to identify five cities that are aligned in a straight line, with minimal distance between each city. I have identified the following five cities that form a perfect line on the map, running from north to south: 1. Groningen, Netherlands: Groningen is a vibrant student city in the north of the Netherlands, known for its lively cultural scene and historic center. 2. Osnabrück, Germany: Osnabrück is a picturesque city in northwest Germany, known for its medieval center and rich history. 3. Erfurt, Germany: Erfurt is a charming city in central Germany, known for its well-preserved medieval center and beautiful gardens. 4. Nuremberg, Germany: Nuremberg is a historic city in southern Germany, known for its medieval architecture and rich history. 5. Innsbruck, Austria: Innsbruck is a stunning city in the Austrian Alps, known for its beautiful mountain scenery and winter sports. These five cities form a perfect line on the map, running from north to south, and offer a diverse range of cultures and experiences. Key points: [ {"name": "Groningen, Netherlands", "lat": 53.2192, "lon": 6.5667, "description": "Groningen is a vibrant student city in the north of the Netherlands, known for its lively cultural scene and historic center. The city is home to the University of Groningen, one of the oldest and most respected universities in the country, and has a rich history dating back to the Middle Ages."}, {"name": "Osnabrück, Germany", "lat": 52.2708, "lon": 8.0431, "description": "Osnabrück is a picturesque city in northwest Germany, known for its medieval center and rich history. The city was the site of the Peace of Westphalia, which ended the Thirty Years' War in Europe, and has a well-preserved medieval center with cobblestone streets and half-timbered houses."}, {"name": "Erfurt, Germany", "lat": 50.9778, "lon": 11.0278, "description": "Erfurt is a charming city in central Germany, known for its well-preserved medieval center and beautiful gardens. The city is home to the Erfurt Cathedral, a stunning Gothic cathedral with a beautiful stained glass window, and the Krämerbrücke, a medieval bridge with shops and houses built on top of it."}, {"name": "Nuremberg, Germany", "lat": 49.4500, "lon": 11.0750, "description": "Nuremberg is a historic city in southern Germany, known for its medieval architecture and rich history. The city is home to the Nuremberg Castle, a stunning medieval fortress with beautiful views of the city, and the Nazi Party Rally Grounds, a reminder of the city's dark past."}, {"name": "Innsbruck, Austria", "lat": 47.2692, "lon": 11.3914, "description": "Innsbruck is a stunning city in the Austrian Alps, known for its beautiful mountain scenery and winter sports. The city is home to the Nordkette, a stunning mountain range with breathtaking views of the city and the surrounding mountains, and the Goldenes Dachl, a beautiful golden roof that is a symbol of the city."} ] """ def generate_key_points(text): prompt = f""" Please generate a set of key geographical points for the following description: {text}, as a json list of less than 10 dictionnaries with the following keys: 'name', 'lat', 'lon', 'description'. Generally try to minimze the distance between locations. Always think of the transportation means that you want to use, and the timing: morning, afternoon, where to sleep. For instance: Description: {description_sf} Thought: {output_example_sf} Description: {description_loire} Thought: {output_example_loire} Now begin. You can make the descriptions a bit more verbose than in the examples. Description: {text} Thought: """ return llm_client.text_generation(prompt, max_new_tokens=2000) def parse_llm_output(output): print(output) rationale = "Thought: " + output.split("Key points:")[0] key_points = output.split("Key points:")[1] output = key_points.replace(" ", "") parsed_output = literal_eval(output) dataframe = pd.DataFrame.from_dict(parsed_output) return dataframe, rationale def create_map_from_markers(dataframe): f_map = Map( location=[dataframe["lat"].mean(), dataframe["lon"].mean()], zoom_start=5, tiles="CartoDB Voyager", ) dataframe.apply( lambda row: folium.CircleMarker( location=[row["lat"], row["lon"]], radius=10, popup=folium.Popup( f"

{row['name']}

{row['description']}

", max_width=450 ), fill=True, fill_color="blue", fill_opacity=0.6, color="blue", weight=1, ).add_to(f_map), axis=1, ) bounds = [[row["lat"], row["lon"]] for _, row in dataframe.iterrows()] f_map.fit_bounds(bounds, padding=(100, 100)) return f_map def run_display(text): output = generate_key_points(text) dataframe, rationale = parse_llm_output(output) map = create_map_from_markers(dataframe) return map, rationale df_examples = pd.DataFrame.from_dict( [ {"description": description_loire, "output": output_example_loire}, {"description": description_sf, "output": output_example_sf}, {"description": description_aligned, "output": output_example_aligned}, ] ) def select_example(df, data: gr.SelectData): row = df.iloc[data.index[0], :] dataframe, rationale = parse_llm_output(row["output"]) return row["description"], create_map_from_markers(dataframe), rationale with gr.Blocks( theme=gr.themes.Soft( primary_hue=gr.themes.colors.yellow, secondary_hue=gr.themes.colors.blue, ) ) as demo: gr.Markdown("# 🗺️ LLM trip planner (based on Mixtral)") with gr.Row(): text = gr.Textbox( label="Describe your trip here:", value=description_sf, scale=1, ) button = gr.Button(scale=0) gr.Markdown("### LLM Output\n_Click the map to see information about the places._") # Get initial map and rationale example_dataframe, example_rationale = parse_llm_output(output_example_sf) display_rationale = gr.Markdown(example_rationale) starting_map = create_map_from_markers(example_dataframe) map = Folium(value=starting_map, height=600, label="Chosen locations") button.click(run_display, inputs=[text], outputs=[map, display_rationale]) gr.Markdown("### Examples") clickable_examples = gr.DataFrame(value=df_examples, height=200) clickable_examples.select( select_example, clickable_examples, outputs=[text, map, display_rationale] ) if __name__ == "__main__": demo.launch()