Update app.py

app.py

@@ -1142,7 +1142,198 @@ def calculate_track_uncertainty(track_points):
         'intensity_max': np.max(intensity_uncertainty),
         'track_length': len(track_points)
     }
+def create_predict_animation(prediction_data, enable_animation=True):
+    """
+    Typhoon genesis PREDICT tab animation:
+    shows monthly genesis-potential + progressive storm positions
+    """
+    try:
+        daily_maps = prediction_data.get('daily_gpi_maps', [])
+        if not daily_maps:
+            return create_error_plot("No GPI data for prediction")
+
+        storms   = prediction_data.get('storm_predictions', [])
+        month    = prediction_data['month']
+        oni      = prediction_data['oni_value']
+        year     = prediction_data.get('year', 2025)
+
+        # -- 1) static underlay: full storm routes (dashed gray lines)
+        static_routes = []
+        for s in storms:
+            track = s.get('track', [])
+            if not track: continue
+            lats = [pt['lat'] for pt in track]
+            lons = [pt['lon'] for pt in track]
+            static_routes.append(
+                go.Scattergeo(
+                    lat=lats, lon=lons,
+                    mode='lines',
+                    line=dict(width=2, dash='dash', color='gray'),
+                    showlegend=False, hoverinfo='skip'
+                )
+            )
+
+        # figure out map bounds
+        all_lats = [pt['lat'] for s in storms for pt in s.get('track',[])]
+        all_lons = [pt['lon'] for s in storms for pt in s.get('track',[])]
+        mb = {
+            'lat_min': min(5,  min(all_lats)-5) if all_lats else 5,
+            'lat_max': max(35, max(all_lats)+5) if all_lats else 35,
+            'lon_min': min(110, min(all_lons)-10) if all_lons else 110,
+            'lon_max': max(180, max(all_lons)+10) if all_lons else 180
+        }
+
+        # -- 2) build frames
+        frames = []
+        for idx, day_data in enumerate(daily_maps):
+            day = day_data['day']
+            gpi = day_data['gpi_field']
+            lats = day_data['lat_range']
+            lons = day_data['lon_range']
+
+            traces = []
+            # genesis‐potential scatter
+            traces.append(go.Scattergeo(
+                lat=np.repeat(lats, len(lons)),
+                lon=np.tile(lons, len(lats)),
+                mode='markers',
+                marker=dict(
+                    size=6, color=gpi.flatten(),
+                    colorscale='Viridis', cmin=0, cmax=3, opacity=0.6,
+                    showscale=(idx==0),
+                    colorbar=(dict(
+                        title=dict(text="Genesis<br>Potential<br>Index", side="right")
+                    ) if idx==0 else None)
+                ),
+                name='GPI',
+                showlegend=(idx==0),
+                hovertemplate=(
+                    'GPI: %{marker.color:.2f}<br>'
+                    'Lat: %{lat:.1f}°N<br>'
+                    'Lon: %{lon:.1f}°E<br>'
+                    f'Day {day} of {month:02d}/{year}<extra></extra>'
+                )
+            ))
+
+            # storm positions up to this day
+            for s in storms:
+                past = [pt for pt in s.get('track',[]) if pt['day'] <= day]
+                if not past: continue
+                lats_p = [pt['lat'] for pt in past]
+                lons_p = [pt['lon'] for pt in past]
+                intens = [pt['intensity'] for pt in past]
+                cats   = [pt['category']  for pt in past]
+
+                # line history
+                traces.append(go.Scattergeo(
+                    lat=lats_p, lon=lons_p, mode='lines',
+                    line=dict(width=2, color='gray'),
+                    showlegend=(idx==0), hoverinfo='skip'
+                ))
+                # current position
+                traces.append(go.Scattergeo(
+                    lat=[lats_p[-1]], lon=[lons_p[-1]],
+                    mode='markers',
+                    marker=dict(size=10, symbol='circle', color='red'),
+                    showlegend=(idx==0),
+                    hovertemplate=(
+                        f"{s['storm_id']}<br>"
+                        f"Intensity: {intens[-1]} kt<br>"
+                        f"Category: {cats[-1]}<extra></extra>"
+                    )
+                ))
+
+            frames.append(go.Frame(
+                data=traces,
+                name=str(day),                       # ← name is REQUIRED as string :contentReference[oaicite:1]{index=1}
+                layout=go.Layout(
+                    geo=dict(
+                        projection_type="natural earth",
+                        showland=True, landcolor="lightgray",
+                        showocean=True, oceancolor="lightblue",
+                        showcoastlines=True, coastlinecolor="darkgray",
+                        center=dict(lat=(mb['lat_min']+mb['lat_max'])/2,
+                                    lon=(mb['lon_min']+mb['lon_max'])/2),
+                        lonaxis_range=[mb['lon_min'], mb['lon_max']],
+                        lataxis_range=[mb['lat_min'], mb['lat_max']],
+                        resolution=50
+                    ),
+                    title=f"Day {day} of {month:02d}/{year} | ONI: {oni:.2f}"
+                )
+            ))
+
+        # -- 3) initial Figure (static + first frame)
+        init_data = static_routes + list(frames[0].data)
+        fig = go.Figure(data=init_data, frames=frames)
+
+        # -- 4) play/pause + slider (redraw=True!)
+        if enable_animation and len(frames)>1:
+            steps = [
+                dict(method="animate",
+                     args=[[fr.name],
+                           {"mode":"immediate",
+                            "frame":{"duration":600,"redraw":True},
+                            "transition":{"duration":0}}],
+                     label=fr.name)
+                for fr in frames
+            ]
 
+            fig.update_layout(
+                updatemenus=[dict(
+                    type="buttons", showactive=False,
+                    x=1.05, y=0.05, xanchor="right", yanchor="bottom",
+                    buttons=[
+                        dict(label="▶ Play",
+                             method="animate",
+                             args=[None,   # None＝all frames
+                                   {"frame":{"duration":600,"redraw":True},  # ← redraw fixes dead ▶
+                                    "fromcurrent":True,"transition":{"duration":0}}]),
+                        dict(label="⏸ Pause",
+                             method="animate",
+                             args=[[None],
+                                   {"frame":{"duration":0,"redraw":False},
+                                    "mode":"immediate"}])
+                    ]
+                )],
+                sliders=[dict(active=0, pad=dict(t=50), steps=steps)]
+            )
+        else:
+            # fallback: show only final day + static routes
+            final = static_routes + list(frames[-1].data)
+            fig = go.Figure(data=final)
+
+        # -- 5) shared layout styling
+        fig.update_layout(
+            title={
+                'text': f"🌊 Typhoon Prediction — {month:02d}/{year} | ONI: {oni:.2f}",
+                'x':0.5,'font':{'size':18}
+            },
+            geo=dict(
+                projection_type="natural earth",
+                showland=True, landcolor="lightgray",
+                showocean=True, oceancolor="lightblue",
+                showcoastlines=True, coastlinecolor="darkgray",
+                showlakes=True, lakecolor="lightblue",
+                showcountries=True, countrycolor="gray",
+                resolution=50,
+                center=dict(lat=20, lon=140),
+                lonaxis_range=[110,180], lataxis_range=[5,35]
+            ),
+            width=1100, height=750,
+            showlegend=True,
+            legend=dict(
+                x=0.02,y=0.98,
+                bgcolor="rgba(255,255,255,0.7)",
+                bordercolor="gray",borderwidth=1
+            )
+        )
+
+        return fig
+
+    except Exception as e:
+        logging.error(f"Error in predict animation: {e}")
+        import traceback; traceback.print_exc()
+        return create_error_plot(f"Animation error: {e}")
 def create_genesis_animation(prediction_data, enable_animation=True):
     """
     Create professional typhoon track animation showing daily genesis potential and storm development