Real-time visualization of plastic particle movement in marine environments
This system transforms static trajectory data into dynamic, animated visualizations where you can watch plastic particles move step-by-step through ocean currents. Simply right-click anywhere on the map and see how plastic pollution travels in Mobile Bay!
- 🎯 Right-click simulation - Click anywhere on the map to release particles
- 🎬 Real-time animations - Watch particles move along their calculated paths
- ⚙️ Configurable settings - Adjust speed, duration, and visualization options
- 🎨 Multi-particle support - Compare trajectories from different release points
- 📊 Progress tracking - Real-time status updates and completion indicators
- 🗺️ Interactive mapping - Zoom, pan, and explore Mobile Bay
- 📱 Web-based interface - No software installation required
# Start API server (Terminal 1)
conda activate plasticparcels-test
python plasticparcels_api_server.py plasticparcels/mobile_schism_output
# Start web server (Terminal 2)
python -m http.server 8080Navigate to: http://localhost:8080/trajectory_map.html
- Right-click anywhere on the Mobile Bay map
- Select "Simulate Trajectory Here"
- Watch the magic happen! 🌊
- User clicks on map location
- API calculates trajectory using PlasticParcels
- Particle appears at release point
- Animation begins - particle moves step-by-step
- Trail draws behind particle (optional)
- Arrow marks final destination
- 🔴 Red dot: Release point where plastic enters water
- 🟡 Moving particle: Current position of plastic particle
- ➖ Dashed trail: Path the particle has traveled
- 🔺 Arrow marker: Final destination when simulation completes
- Speed: Very Fast (50ms) → Very Slow (1s)
- Trail Display: Show/hide particle path
- Pause/Resume: Control all animations
- Clear All: Remove trajectories and start fresh
- Duration: 6 hours to 1 week
- Output Frequency: Every 15 minutes to 2 hours
- Multiple Particles: Unlimited concurrent simulations
- Domain Coverage: Complete Mobile Bay area
┌─────────────────┐ ┌─────────────────┐ ┌─────────────────┐
│ Web Browser │ │ HTTP Server │ │ API Server │
│ │ │ (Port 8080) │ │ (Port 5000) │
│ Animated Map │◄──►│ │ │ │
│ Interface │ │ Static Files │ │ PlasticParcels │
│ │ │ │ │ Simulation │
└─────────────────┘ └─────────────────┘ └─────────────────┘
│ │
└──────────── API Calls ──────────────────────┘
- Backend: Python, Flask, PlasticParcels, NumPy
- Frontend: HTML5, JavaScript, Leaflet.js, CSS3
- Data: SCHISM ocean model, GeoJSON trajectories
- Deployment: HTTP servers with port forwarding
plasticparcels/
├── 🎬 trajectory_map.html # Main animated interface
├── 🖥️ plasticparcels_api_server.py # REST API server
├── 🔍 check_api_status.py # System health checker
├── 🐍 api_client_example.py # Python client examples
├── 📊 demo.html # Original demo interface
├── 📚 Documentation/
│ ├── README.md # This file
│ ├── USER_GUIDE.md # User instructions
│ ├── DEVELOPER_REFERENCE.md # Technical details
│ ├── ANIMATION_DOCUMENTATION.md # Complete documentation
│ ├── QUICK_REFERENCE.md # Common tasks
│ └── API_README.md # API reference
└── 📁 plasticparcels/
└── mobile_schism_output/ # Mobile Bay data
- Pollution tracking: Understand plastic transport patterns
- Current analysis: Visualize ocean flow dynamics
- Environmental impact: Assess pollution accumulation zones
- Model validation: Compare simulations with observations
- Interactive demonstrations: Engage audiences with live simulations
- Concept illustration: Show how ocean currents work
- Environmental awareness: Visualize plastic pollution impacts
- Student projects: Hands-on learning with real data
- Spill response: Predict pollution spread patterns
- Monitoring planning: Optimize sampling locations
- Policy support: Inform environmental regulations
- Risk assessment: Evaluate contamination scenarios
- Longitude: -89.124°E to -87.964°E
- Latitude: 30.017°N to 30.617°N
- Features: Bay entrance, main channels, river mouths, coastal areas
- Data: 11 days of hourly SCHISM model output
- Resolution: High-resolution grid with 61 points
- Bay entrance (-87.97°E, 30.25°N): Tidal exchange patterns
- Main channel (-88.04°E, 30.35°N): Primary flow dynamics
- River mouths (-88.1°E, 30.6°N): Freshwater influence
- Coastal zones (-88.2°E, 30.4°N): Retention areas
- USER_GUIDE.md: Complete step-by-step instructions
- QUICK_REFERENCE.md: Common tasks and shortcuts
- DEVELOPER_REFERENCE.md: Technical implementation
- API_README.md: REST API documentation
- ANIMATION_DOCUMENTATION.md: Full system docs
- START_SERVER.md: Deployment instructions
# Create conda environment
conda create -n plasticparcels-test python=3.11 -y
conda activate plasticparcels-test
# Install PlasticParcels
conda install conda-forge::plasticparcels -y
# Install web dependencies
pip install flask flask-cors requestsEnsure you have Mobile Bay SCHISM data in PlasticParcels format:
plasticparcels/mobile_schism_output/
├── settings.json
└── [SCHISM data files]
# Start API server
python plasticparcels_api_server.py plasticparcels/mobile_schism_output
# Start web server (new terminal)
python -m http.server 8080Open browser to: http://localhost:8080/trajectory_map.html
# Check system health
python check_api_status.py
# Test API directly
curl http://localhost:5000/health
# Run example client
python api_client_example.py --test- Connection failed: Verify servers are running on ports 5000 and 8080
- Animation freezes: Use Pause/Resume or refresh browser
- Simulation errors: Ensure release points are within Mobile Bay
- Performance issues: Limit concurrent animations, use appropriate speeds
"The animated trajectories make it so much easier to understand how ocean currents work!" - Marine Science Student
"Perfect for demonstrating plastic pollution transport to stakeholders." - Environmental Consultant
"The right-click interface is incredibly intuitive - anyone can use it!" - Outreach Coordinator
- University courses: Teaching oceanography and environmental science
- Research presentations: Visualizing model results for conferences
- Public outreach: Engaging communities in pollution discussions
- Policy briefings: Supporting environmental decision-making
- 3D visualization: Depth-dependent trajectories
- Real-time data: Live ocean conditions
- Mobile app: Smartphone interface
- Batch processing: Multiple simultaneous simulations
- Data export: Download results in various formats
- GIS platforms: QGIS, ArcGIS plugins
- Scientific workflows: Jupyter notebook integration
- Cloud deployment: Scalable web services
- Educational platforms: LMS integration
- Check documentation: Comprehensive guides available
- Run diagnostics: Use built-in testing tools
- Review logs: Check terminal output for errors
- Try examples: Use provided client scripts
- Report issues: Document bugs and feature requests
- Share improvements: Code contributions welcome
- Provide feedback: User experience insights valuable
- Create content: Documentation and tutorials
This project builds on PlasticParcels (MIT License) and uses open-source components.
If you use this system in research, please cite:
- PlasticParcels: [Original paper citation]
- This visualization system: [Your publication details]
- PlasticParcels team: Core simulation engine
- SCHISM developers: Ocean model data
- Leaflet.js: Interactive mapping
- Open source community: Supporting libraries
Start simulating plastic trajectories now!
- Launch the servers
- Open
http://localhost:8080/trajectory_map.html - Right-click anywhere on Mobile Bay
- Watch plastic particles come to life!
Transform static data into dynamic understanding with the PlasticParcels Animated Trajectory System. ✨