Mahdi-Hassan/Somalia-Flood-Web-GIS

# Somalia Flood Extent Comparison Web GIS An interactive web map comparing the **initial** and **peak** extent of flooding across Somali districts, alongside the locations and status of nearby **IDP (Internally Displaced Persons) sites** that may be affected. Built for CCCM/humanitarian teams who need a fast, visual read on flood impact, without needing GIS software. ## What it does - **Swipe comparison** of Initial vs Peak flood extent per district, on a satellite basemap - **IDP site markers**, sized by household count, clustered at low zoom, colored/weighted by verification status - **Flood impact analysis**: how many IDP sites fall inside the Initial extent, the Peak extent, and either (deduplicated) — precomputed offline from the original shapefiles for accuracy - **KPI sidebar**: total sites, verification rate (color-coded), households and individuals at risk, all filtered to the selected district - **About panel**: data sources, methodology, and caveats - **Narrative side panel**: what problem this solves, who it's for, and author contact ## Tech stack - React + Vite + TypeScript - MapLibre GL JS + PMTiles (vector tiles) - `@maplibre/maplibre-gl-compare` for the swipe UI - `@turf/turf` for offline geometry analysis (point-in-polygon, area) - `shapefile` (npm) for reading `.shp` files directly in Node - Hosted on GitHub Pages via GitHub Actions ## Getting started ```bash npm install npm run dev ``` ## Project structure