Update app.py

app.py

@@ -294,29 +294,6 @@ def generate_main_analysis(start_year, start_month, end_year, end_month, enso_ph
     return tracks_fig, wind_scatter, pressure_scatter, regression_fig, slopes_text
 
 # Path animation function
-def generate_path_animation(year, typhoon, standard):
-    typhoon_id = typhoon.split('(')[-1].strip(')')
-    storm = ibtracs.get_storm(typhoon_id)
-    fig = go.Figure()
-    fig.add_trace(go.Scattergeo(lon=storm.lon, lat=storm.lat, mode='lines', line=dict(width=2, color='gray')))
-    fig.add_trace(go.Scattergeo(lon=[storm.lon[0]], lat=[storm.lat[0]], mode='markers',
-                                marker=dict(size=10, color='green', symbol='star'), name='Start'))
-    frames = [
-        go.Frame(data=[
-            go.Scattergeo(lon=storm.lon[:i+1], lat=storm.lat[:i+1], mode='lines', line=dict(width=2, color='blue')),
-            go.Scattergeo(lon=[storm.lon[i]], lat=[storm.lat[i]], mode='markers',
-                          marker=dict(size=10, color=categorize_typhoon_by_standard(storm.vmax[i], standard)[1]))
-        ], name=f"frame{i}") for i in range(len(storm.time))
-    ]
-    fig.frames = frames
-    fig.update_layout(
-        title=f"{year} {storm.name} Typhoon Path",
-        geo=dict(projection_type='natural earth', showland=True),
-        updatemenus=[{"buttons": [{"label": "Play", "method": "animate", "args": [None, {"frame": {"duration": 100}}]},
-                                  {"label": "Pause", "method": "animate", "args": [[None], {"mode": "immediate"}]}]}]
-    )
-    return fig
-
 def categorize_typhoon_by_standard(wind_speed, standard):
     if standard == 'taiwan':
         wind_speed_ms = wind_speed * 0.514444
@@ -342,6 +319,164 @@ def categorize_typhoon_by_standard(wind_speed, standard):
             return 'Tropical Storm', atlantic_standard['Tropical Storm']['color']
         return 'Tropical Depression', atlantic_standard['Tropical Depression']['color']
 
+def generate_improved_animation(year, typhoon, standard):
+    if not typhoon:
+        return None
+
+    typhoon_id = typhoon.split('(')[-1].strip(')')
+    storm = ibtracs.get_storm(typhoon_id)
+
+    # Create frames for animation
+    frames = []
+    for i in range(len(storm.time)):
+        category, color = categorize_typhoon_by_standard(storm.vmax[i], standard)
+        frame_data = [
+            go.Scattergeo(
+                lon=storm.lon[:i+1], 
+                lat=storm.lat[:i+1], 
+                mode='lines', 
+                line=dict(width=2, color='blue'),
+                name="Track",
+                hoverinfo="none"
+            ),
+            go.Scattergeo(
+                lon=[storm.lon[i]], 
+                lat=[storm.lat[i]], 
+                mode='markers', 
+                marker=dict(size=12, color=color),
+                name=f"Current Position",
+                text=[f"Time: {storm.time[i].strftime('%Y-%m-%d %H:%M')}<br>Wind: {storm.vmax[i]:.1f} kt<br>Category: {category}"],
+                hoverinfo="text"
+            )
+        ]
+        if i > 0:
+            frame_data.append(
+                go.Scattergeo(
+                    lon=storm.lon[:i], 
+                    lat=storm.lat[:i], 
+                    mode='markers', 
+                    marker=dict(size=5, color='rgba(100,100,100,0.5)'),
+                    name="Previous Positions",
+                    hoverinfo="none",
+                    showlegend=False
+                )
+            )
+        frames.append(go.Frame(data=frame_data, name=str(i)))
+
+    # Initial figure
+    fig = go.Figure(
+        data=[
+            go.Scattergeo(
+                lon=[storm.lon[0]], 
+                lat=[storm.lat[0]],
+                mode='markers', 
+                marker=dict(size=12, color='green'),
+                name="Start",
+                text=[f"Start: {storm.time[0].strftime('%Y-%m-%d %H:%M')}"],
+                hoverinfo="text"
+            )
+        ],
+        frames=frames
+    )
+
+    # Add category legend
+    standard_dict = atlantic_standard if standard == 'atlantic' else taiwan_standard
+    for cat, details in standard_dict.items():
+        fig.add_trace(go.Scattergeo(
+            lon=[None], lat=[None], mode='markers',
+            marker=dict(size=10, color=details['color']),
+            name=cat,
+            showlegend=True
+        ))
+
+    # Map focus
+    min_lat, max_lat = min(storm.lat), max(storm.lat)
+    min_lon, max_lon = min(storm.lon), max(storm.lon)
+    lat_padding = max((max_lat - min_lat) * 0.3, 5)
+    lon_padding = max((max_lon - min_lon) * 0.3, 5)
+
+    # Update layout with animation controls
+    fig.update_layout(
+        title=f"{year} {storm.name} Typhoon Path",
+        geo=dict(
+            projection_type='natural earth',
+            showland=True,
+            showcoastlines=True,
+            landcolor='rgb(243, 243, 243)',
+            countrycolor='rgb(204, 204, 204)',
+            coastlinecolor='rgb(204, 204, 204)',
+            showocean=True,
+            oceancolor='rgb(230, 230, 255)',
+            lataxis={'range': [min_lat - lat_padding, max_lat + lat_padding]},
+            lonaxis={'range': [min_lon - lon_padding, max_lon + lon_padding]}
+        ),
+        updatemenus=[{
+            "buttons": [
+                {
+                    "args": [None, {"frame": {"duration": 200, "redraw": True},
+                                   "fromcurrent": True,
+                                   "transition": {"duration": 0},
+                                   "mode": "immediate"}],
+                    "label": "Play",
+                    "method": "animate"
+                },
+                {
+                    "args": [[None], {"frame": {"duration": 0, "redraw": True},
+                                     "mode": "immediate",
+                                     "transition": {"duration": 0}}],
+                    "label": "Pause",
+                    "method": "animate"
+                }
+            ],
+            "direction": "left",
+            "pad": {"r": 10, "t": 10},
+            "showactive": True,
+            "type": "buttons",
+            "x": 0.1,
+            "xanchor": "left",
+            "y": 0,
+            "yanchor": "bottom"
+        }],
+        sliders=[{
+            "active": 0,
+            "yanchor": "top",
+            "xanchor": "left",
+            "currentvalue": {
+                "font": {"size": 12},
+                "prefix": "Time: ",
+                "visible": True,
+                "xanchor": "right"
+            },
+            "transition": {"duration": 0},
+            "pad": {"b": 10, "t": 50},
+            "len": 0.9,
+            "x": 0.1,
+            "y": 0,
+            "steps": [
+                {
+                    "args": [[str(i)], {"frame": {"duration": 200, "redraw": True},
+                                       "mode": "immediate",
+                                       "transition": {"duration": 0}}],
+                    "label": storm.time[i].strftime('%m/%d %H:%M') if i < len(storm.time) else "",
+                    "method": "animate"
+                } for i in range(len(storm.time))
+            ]
+        }],
+        height=700,
+        showlegend=True,
+        legend=dict(
+            yanchor="top",
+            y=0.99,
+            xanchor="left",
+            x=0.01,
+            bgcolor="rgba(255, 255, 255, 0.8)"
+        ),
+        # Ensure animation starts automatically
+        autosize=True
+    )
+
+    return fig
+
 # Logistic regression functions
 def perform_wind_regression(start_year, start_month, end_year, end_month):
     start_date = datetime(start_year, start_month, 1)
@@ -404,12 +539,9 @@ with gr.Blocks(title="Typhoon Analysis Dashboard") as demo:
             enso_phase = gr.Dropdown(label="ENSO Phase", choices=['all', 'El Nino', 'La Nina', 'Neutral'], value='all')
             typhoon_search = gr.Textbox(label="Typhoon Search")
         analyze_btn = gr.Button("Generate Tracks")
-        
-        # Display all tracks
         tracks_plot = gr.Plot(label="Typhoon Tracks", elem_id="tracks_plot")
         typhoon_count = gr.Textbox(label="Number of Typhoons Displayed")
         
-        # Enhanced function to show all track data
         def get_full_tracks(start_year, start_month, end_year, end_month, enso_phase, typhoon_search):
             start_date = datetime(start_year, start_month, 1)
             end_date = datetime(end_year, end_month, 28)
@@ -418,53 +550,34 @@ with gr.Blocks(title="Typhoon Analysis Dashboard") as demo:
                 (merged_data['ISO_TIME'] <= end_date)
             ]
             filtered_data['ENSO_Phase'] = filtered_data['ONI'].apply(classify_enso_phases)
-            
             if enso_phase != 'all':
                 filtered_data = filtered_data[filtered_data['ENSO_Phase'] == enso_phase.capitalize()]
-            
-            # Get all unique storms
             unique_storms = filtered_data['SID'].unique()
             count = len(unique_storms)
-            
-            # Create the map with all tracks
             fig = go.Figure()
-            
-            # Add all tracks
             for sid in unique_storms:
                 storm_data = typhoon_data[typhoon_data['SID'] == sid]
                 name = storm_data['NAME'].iloc[0] if not pd.isna(storm_data['NAME'].iloc[0]) else "Unnamed"
-                
-                # Get ENSO phase color
                 storm_oni = filtered_data[filtered_data['SID'] == sid]['ONI'].iloc[0]
                 color = 'red' if storm_oni >= 0.5 else ('blue' if storm_oni <= -0.5 else 'green')
-                
-                # Add the track line
                 fig.add_trace(go.Scattergeo(
-                    lon=storm_data['LON'], 
-                    lat=storm_data['LAT'], 
-                    mode='lines',
+                    lon=storm_data['LON'], lat=storm_data['LAT'], mode='lines',
                     name=f"{name} ({storm_data['SEASON'].iloc[0]})",
                     line=dict(width=1.5, color=color),
                     hoverinfo="name"
                 ))
-            
-            # Highlight searched typhoon if specified
             if typhoon_search:
                 search_mask = typhoon_data['NAME'].str.contains(typhoon_search, case=False, na=False)
                 if search_mask.any():
                     for sid in typhoon_data[search_mask]['SID'].unique():
                         storm_data = typhoon_data[typhoon_data['SID'] == sid]
                         fig.add_trace(go.Scattergeo(
-                            lon=storm_data['LON'], 
-                            lat=storm_data['LAT'], 
-                            mode='lines+markers',
+                            lon=storm_data['LON'], lat=storm_data['LAT'], mode='lines+markers',
                             name=f"MATCHED: {storm_data['NAME'].iloc[0]} ({storm_data['SEASON'].iloc[0]})",
                             line=dict(width=3, color='yellow'),
                             marker=dict(size=5),
                             hoverinfo="name"
                         ))
-            
-            # Add colorbar/legend for ENSO phases
             fig.update_layout(
                 title=f"Typhoon Tracks ({start_year}-{start_month} to {end_year}-{end_month})",
                 geo=dict(
@@ -481,15 +594,12 @@ with gr.Blocks(title="Typhoon Analysis Dashboard") as demo:
                 showlegend=True,
                 height=700
             )
-            
-            # Add annotations explaining colors
             fig.add_annotation(
                 x=0.02, y=0.98, xref="paper", yref="paper",
                 text="Red: El Niño, Blue: La Niña, Green: Neutral",
                 showarrow=False, align="left",
                 bgcolor="rgba(255,255,255,0.8)"
             )
-            
             return fig, f"Total typhoons displayed: {count}"
             
         analyze_btn.click(
@@ -510,7 +620,6 @@ with gr.Blocks(title="Typhoon Analysis Dashboard") as demo:
         wind_scatter = gr.Plot(label="Wind Speed vs ONI")
         wind_regression_results = gr.Textbox(label="Wind Regression Results")
         
-        # Fixed function for wind analysis
         def get_wind_analysis(start_year, start_month, end_year, end_month, enso_phase, typhoon_search):
             results = generate_main_analysis(start_year, start_month, end_year, end_month, enso_phase, typhoon_search)
             regression = perform_wind_regression(start_year, start_month, end_year, end_month)
@@ -534,7 +643,6 @@ with gr.Blocks(title="Typhoon Analysis Dashboard") as demo:
         pressure_scatter = gr.Plot(label="Pressure vs ONI")
         pressure_regression_results = gr.Textbox(label="Pressure Regression Results")
         
-        # Fixed function for pressure analysis
         def get_pressure_analysis(start_year, start_month, end_year, end_month, enso_phase, typhoon_search):
             results = generate_main_analysis(start_year, start_month, end_year, end_month, enso_phase, typhoon_search)
             regression = perform_pressure_regression(start_year, start_month, end_year, end_month)
@@ -559,7 +667,6 @@ with gr.Blocks(title="Typhoon Analysis Dashboard") as demo:
         slopes_text = gr.Textbox(label="Regression Slopes")
         lon_regression_results = gr.Textbox(label="Longitude Regression Results")
         
-        # Fixed function for longitude analysis
         def get_longitude_analysis(start_year, start_month, end_year, end_month, enso_phase, typhoon_search):
             results = generate_main_analysis(start_year, start_month, end_year, end_month, enso_phase, typhoon_search)
             regression = perform_longitude_regression(start_year, start_month, end_year, end_month)
@@ -575,183 +682,19 @@ with gr.Blocks(title="Typhoon Analysis Dashboard") as demo:
         with gr.Row():
             year_dropdown = gr.Dropdown(label="Year", choices=[str(y) for y in range(1950, 2025)], value="2024")
             typhoon_dropdown = gr.Dropdown(label="Typhoon")
-            standard_dropdown = gr.Dropdown(label="Classification Standard", 
-                                          choices=['atlantic', 'taiwan'], value='atlantic')
-        
-        # Completely redesigned animation function to show track movement clearly
-        def generate_improved_animation(year, typhoon, standard):
-            if not typhoon:
-                return None
-                
-            typhoon_id = typhoon.split('(')[-1].strip(')')
-            storm = ibtracs.get_storm(typhoon_id)
-            
-            # Create frames that show the growing track
-            frames = []
-            
-            # Add frames showing growing track
-            for i in range(len(storm.time)):
-                # Get wind category and color
-                category, color = categorize_typhoon_by_standard(storm.vmax[i], standard)
-                
-                # Create frame showing path up to current point
-                frame_data = [
-                    # Path line up to current point
-                    go.Scattergeo(
-                        lon=storm.lon[:i+1], 
-                        lat=storm.lat[:i+1], 
-                        mode='lines', 
-                        line=dict(width=2, color='blue'),
-                        name="Track"
-                    ),
-                    # Current position
-                    go.Scattergeo(
-                        lon=[storm.lon[i]], 
-                        lat=[storm.lat[i]], 
-                        mode='markers', 
-                        marker=dict(size=12, color=color),
-                        name=f"Current Position",
-                        text=f"Time: {storm.time[i].strftime('%Y-%m-%d %H:%M')}<br>Wind: {storm.vmax[i]} kt<br>Category: {category}"
-                    )
-                ]
-                
-                # Add previous positions as smaller markers
-                if i > 0:
-                    frame_data.append(
-                        go.Scattergeo(
-                            lon=storm.lon[:i], 
-                            lat=storm.lat[:i], 
-                            mode='markers', 
-                            marker=dict(size=5, color='rgba(100,100,100,0.5)'),
-                            name="Previous Positions",
-                            showlegend=False
-                        )
-                    )
-                
-                frames.append(go.Frame(data=frame_data, name=f"frame{i}"))
-            
-            # Initial figure showing start point
-            fig = go.Figure(
-                data=[
-                    go.Scattergeo(
-                        lon=[storm.lon[0]], 
-                        lat=[storm.lat[0]],
-                        mode='markers', 
-                        marker=dict(size=12, color='green'),
-                        name="Starting Position",
-                        text=f"Start: {storm.time[0].strftime('%Y-%m-%d %H:%M')}"
-                    )
-                ],
-                frames=frames
-            )
-            
-            # Add category legend
-            if standard == 'atlantic':
-                for cat, details in atlantic_standard.items():
-                    fig.add_trace(go.Scattergeo(
-                        lon=[None], lat=[None], mode='markers',
-                        marker=dict(size=10, color=details['color']),
-                        name=cat
-                    ))
-            else:
-                for cat, details in taiwan_standard.items():
-                    fig.add_trace(go.Scattergeo(
-                        lon=[None], lat=[None], mode='markers',
-                        marker=dict(size=10, color=details['color']),
-                        name=cat
-                    ))
-            
-            # Focus map on storm area
-            min_lat, max_lat = min(storm.lat), max(storm.lat)
-            min_lon, max_lon = min(storm.lon), max(storm.lon)
-            lat_padding = (max_lat - min_lat) * 0.3 or 5
-            lon_padding = (max_lon - min_lon) * 0.3 or 5
-            
-            # Update layout with better animation controls
-            fig.update_layout(
-                title=f"{year} {storm.name} Typhoon Path",
-                geo=dict(
-                    projection_type='natural earth',
-                    showland=True,
-                    showcoastlines=True,
-                    landcolor='rgb(243, 243, 243)',
-                    countrycolor='rgb(204, 204, 204)',
-                    coastlinecolor='rgb(204, 204, 204)',
-                    showocean=True,
-                    oceancolor='rgb(230, 230, 255)',
-                    lataxis={'range': [min_lat - lat_padding, max_lat + lat_padding]},
-                    lonaxis={'range': [min_lon - lon_padding, max_lon + lon_padding]}
-                ),
-                updatemenus=[{
-                    "buttons": [
-                        {
-                            "args": [None, {"frame": {"duration": 100, "redraw": True}, "fromcurrent": True, "mode": "immediate"}],
-                            "label": "Play",
-                            "method": "animate"
-                        },
-                        {
-                            "args": [[None], {"frame": {"duration": 0, "redraw": True}, "mode": "immediate"}],
-                            "label": "Pause",
-                            "method": "animate"
-                        }
-                    ],
-                    "direction": "left",
-                    "pad": {"r": 10, "t": 10},
-                    "type": "buttons",
-                    "x": 0.1,
-                    "y": 0
-                }],
-                sliders=[{
-                    "active": 0,
-                    "yanchor": "top",
-                    "xanchor": "left",
-                    "currentvalue": {
-                        "font": {"size": 12},
-                        "prefix": "Time: ",
-                        "visible": True,
-                        "xanchor": "right"
-                    },
-                    "pad": {"b": 10, "t": 50},
-                    "len": 0.9,
-                    "x": 0.1,
-                    "y": 0,
-                    "steps": [
-                        {
-                            "args": [[f.name], {
-                                "frame": {"duration": 0, "redraw": True},
-                                "mode": "immediate"
-                            }],
-                            "label": storm.time[i].strftime('%m/%d %H:00') if i < len(storm.time) else "",
-                            "method": "animate"
-                        } for i, f in enumerate(frames)
-                    ]
-                }],
-                height=700,
-                showlegend=True,
-                legend=dict(
-                    yanchor="top",
-                    y=0.99,
-                    xanchor="left",
-                    x=0.01,
-                    bgcolor="rgba(255, 255, 255, 0.8)"
-                )
-            )
-            
-            return fig
+            standard_dropdown = gr.Dropdown(label="Classification Standard", choices=['atlantic', 'taiwan'], value='atlantic')
         
         animate_btn = gr.Button("Generate Animation")
         path_plot = gr.Plot(label="Typhoon Path Animation", elem_id="animation_plot")
         animation_info = gr.Markdown("""
         ### Animation Instructions
         1. Select a year and typhoon from the dropdowns
-        2. Click "Generate Animation"
-        3. Use the play button to start the animation
-        4. Use the slider to manually control the animation timeline
-        5. The animation shows the typhoon track developing over time, with the current position highlighted
-        6. Colors indicate typhoon intensity according to the selected classification standard
+        2. Choose a classification standard (Atlantic or Taiwan)
+        3. Click "Generate Animation"
+        4. Use the "Play" button to start the animation or the slider to navigate through the typhoon's path
+        5. Colors indicate typhoon intensity according to the selected standard
         """)
         
-        # Year dropdown change function
         def update_typhoon_options(year):
             season = ibtracs.get_season(int(year))
             storm_summary = season.summary()
@@ -765,15 +708,19 @@ with gr.Blocks(title="Typhoon Analysis Dashboard") as demo:
             outputs=path_plot
         )
 
-    # Custom CSS for better spacing and to ensure plots are visible
+    # Custom CSS for better spacing and visibility
     gr.HTML("""
     <style>
     #tracks_plot, #animation_plot {
         height: 700px !important;
+        width: 100%;
     }
     .plot-container {
         min-height: 600px;
     }
+    .gr-plotly {
+        width: 100% !important;
+    }
     </style>
     """)