A real-time visualization tool showing river sections affected by sewage discharges from combined sewer overflows across the UK. The application combines Event Duration Monitoring (EDM) data with a basic hydrological model to track sewage discharges downstream along non-tidal river networks.
The map highlights areas downstream of active and recent discharges, providing near real-time data from water companies' monitoring systems. The application uses a basic hydrological model based on the Center for Ecology and Hydrology's Integrated Hydrological Digital Terrain Model to track sewage movement.
Note: This tool should not be used in isolation to assess pollution or health risks at specific locations, as it does not account for dilution, river flow, or dispersion effects on pollutant concentration.
- React application built with Vite
- ArcGIS JavaScript API for mapping
- TypeScript for type safety
- Radix UI and Emotion for styling
- Interactive map with zoom constraints and custom extent
- Geolocation support
- Custom search functionality
- Dark mode support
- Rain radar overlay
- Mobile-responsive layout.
- Custom popup handling for discharge points
- Discharge source points are served via ArcGIS hosted feature services
- Discharge affected river sections are fetched as GeoJSON and rendered as a client-side layer
- Historical discharge data is fetched from water company APIs
- Rain radar data is sourced from RainViewer's API
- Type checking with TypeScript
- ESLint and Prettier for code formatting
- Husky for git hooks
- Vitest for testing
- Path aliases for clean imports
The application is deployed as a static site on Vercel:
- Frontend assets are built using Vite and deployed to Vercel's edge network
- Environment variables are managed through Vercel's configuration
- Automatic branch deployments with unique preview URLs
- Production deployments triggered by main branch updates
- Edge caching and CDN distribution for optimal performance
- Automatic SSL/TLS certificate management
- Analytics via @vercel/analytics
- ArcGIS Services: The application uses ArcGIS JavaScript API services (free tier) for:
- Base maps and feature layers
- Spatial analysis and queries
- Geocoding services
- Location services
- RainViewer API: For precipitation radar visualization
- Water Company APIs: For real-time EDM data
- Node.js 18.0.0 or higher
- ArcGIS API key (for map services)
- Clone the repository:
git clone https://github.com/JonnyDawe/UK-Sewage-Map.git- Install dependencies:
npm install- Create a
.env.localfile with your ArcGIS API key:
VITE_ARCGIS_API_KEY=your_api_key_here
- Start the development server:
npm run devnpm run dev- Start development servernpm run build- Build for productionnpm run preview- Preview production buildnpm run lint- Lint and fix codenpm run check-types- Type check TypeScript
The application combines several data sources:
Real-time data is collected through Event Duration Monitoring by individual water companies, providing near-real time data on storm overflows. This data is accessed via the Storm Overflow Hub maintained by Water UK. Storm overflows release untreated, diluted sewage into the environment. Currently, only Thames Water provides an API for accessing historical sewage spill data. For more context, read our article about why water companies need to be more transparent with environmental models and data.
- Center for Ecology and Hydrology's Integrated Hydrological Digital Terrain Model
- Environment Agency discharge data
- RainViewer precipitation data
We welcome contributions! Please see our contributing guidelines for more details.
- Alex Lipp (UCL) - Backend Development
- Jonny Dawe - Frontend Development
While every effort has been made to ensure accuracy, this is experimental software and errors may occur. Please report any issues through our GitHub repositories.