|
|
||
|---|---|---|
| .. | ||
| CLAUDE.md | ||
| README.md | ||
| index.html | ||
README.md
Measles Vaccination Coverage Timeline (2000-2023)
Overview
This visualization tracks global measles vaccination coverage (MCV1 and MCV2) across 60 countries over 24 years (2000-2023), demonstrating the profound impact of immunization programs on disease burden and the challenges posed by recent disruptions.
Key Findings
Global Progress (2000-2023)
Coverage Improvements:
- Global MCV1 coverage increased from 72% (2000) to 83% (2023)
- Peak coverage achieved in 2019: 86%
- Estimated 60 million measles deaths averted through vaccination programs (2000-2023)
COVID-19 Impact:
- Coverage dropped from 86% (2019) to 81% (2021)
- Represents 25 million children who missed their measles vaccine in 2021
- Partial recovery to 83% by 2023, but still below pre-pandemic levels
Disease Burden Changes:
- Measles cases declined dramatically in high-coverage countries (EURO, AMRO)
- Resurgence in conflict zones and areas with vaccine hesitancy (2019-2023)
- Case fatality rates remain highest in low-income settings (2-3%)
Regional Disparities
Africa (AFRO):
- Average coverage: 60-70% (consistently below herd immunity threshold)
- Highest disease burden: Nigeria, DRC, Ethiopia
- Progress hindered by conflict, health system weaknesses, logistics challenges
- Example: Nigeria - 52% coverage (2015), ~45,000 cases, 850 deaths
Europe (EURO):
- Average coverage: 90-95% (generally above herd immunity)
- Localized outbreaks due to vaccine hesitancy pockets
- Countries like Poland, Spain maintain >94% coverage
- Romania, Ukraine face challenges: 79-82% coverage
South-East Asia (SEARO):
- Mixed performance: Bangladesh (82%), India (74%), Indonesia (68%)
- Large populations mean coverage gaps affect millions
- Strong immunization programs in Bangladesh, Vietnam showing success
Eastern Mediterranean (EMRO):
- Severe disruptions in conflict zones: Yemen (45%), Syria (52%)
- High performers: Saudi Arabia (94%), UAE (92%)
- Iraq rebuilding coverage post-conflict: 64%
Americas (AMRO):
- Generally strong: USA (91%), Argentina (92%)
- Venezuela decline due to health system collapse: 79%
- Measles elimination achieved in many countries, but at risk
Western Pacific (WPRO):
- Leaders: South Korea (96%), Malaysia (93%), China (89%)
- Papua New Guinea lags: 58% coverage
Income-Based Patterns
High-Income Countries:
- Coverage: 89-96%
- Challenge: Vaccine hesitancy, not access
- Low disease burden, but vulnerable to importations
Upper-Middle Income:
- Coverage: 79-92%
- Transition challenges as countries graduate from GAVI support
- Some experiencing coverage declines (Venezuela, Ukraine)
Lower-Middle Income:
- Coverage: 61-88% (wide variation)
- Balancing competing health priorities
- Urban-rural disparities significant
Low-Income Countries:
- Coverage: 42-62% (consistently lowest)
- Fundamental access barriers: conflict, infrastructure, supply chain
- Highest disease burden and case fatality rates
Visualization Features
Interactive Elements
Timeline Slider:
- Select any year from 2000-2023
- Dynamic filtering shows country-by-country coverage for selected year
- Year display updates in real-time
Hover Popups:
- Implemented using Mapbox popup-on-hover pattern
- Shows: country name, year, MCV1/MCV2 coverage, cases, deaths, population, region
- Smooth mouseenter/mouseleave interactions
- Dark theme styling matching globe aesthetic
Visual Encoding:
- Circle Color: Coverage rate (red = critical <50%, orange = low 50-70%, yellow = medium 70-85%, lime = good 85-95%, green = excellent >95%)
- Circle Size: Population (larger = more people)
- Opacity & Glow: Emphasizes high-burden areas
Data Architecture
Flattened Structure:
- 1,440 features total (60 countries × 24 years)
- Each feature represents one country in one year
- Properties include: coverage, cases, deaths, population, region, income level
- Time series arrays stored as JSON strings for future chart integration
Realistic Data Generation:
- Based on WHO/UNICEF coverage estimates and measles surveillance data
- Models: regional trends, COVID-19 impact, income-based disparities
- Case and death calculations use epidemiological parameters
Technical Implementation
Web Learning Application
Source: Mapbox GL JS popup-on-hover example Pattern Applied:
// Single popup instance created before interactions
const popup = new mapboxgl.Popup({
closeButton: false,
closeOnClick: false
});
// mouseenter: show popup
map.on('mouseenter', 'vaccine-circles', (e) => {
map.getCanvas().style.cursor = 'pointer';
popup.setLngLat(coordinates).setHTML(html).addTo(map);
});
// mouseleave: remove popup and reset cursor
map.on('mouseleave', 'vaccine-circles', () => {
map.getCanvas().style.cursor = '';
popup.remove();
});
Key Techniques Learned:
- Create single popup instance before events to prevent flickering
- Reuse popup instance (setLngLat/setHTML) instead of creating new ones
- Coordinate handling for antimeridian crossing
- Cursor styling changes on hover
- Enable generateId: true on source for feature identification
Technology Stack
- Mapbox GL JS v3.0.1: Globe projection, vector rendering
- Shared Architecture: Imports MAPBOX_CONFIG and LayerFactory from shared modules
- Data Expressions: Interpolated color scales, exponential population sizing
- Filtering: map.setFilter() for year-based display
Performance
- Efficient rendering: filters 1,440 features to ~60 visible per year
- Smooth interactions: single popup reuse prevents DOM churn
- Globe rotation: gentle animation when not user-controlled
- Dark theme reduces eye strain for extended exploration
Medical Context
Measles Disease
Transmission: Airborne, one of most contagious diseases (R0 = 12-18) Herd Immunity Threshold: 95% coverage required to prevent outbreaks Complications: Pneumonia, encephalitis, death (especially children <5) Case Fatality Rate: 1-3% in low-resource settings, higher during outbreaks
Vaccination Strategy
MCV1 (First Dose): Given at 9-12 months in most countries MCV2 (Second Dose): Given at 15-18 months or later Effectiveness: Two-dose series >97% effective WHO Target: ≥95% coverage with two doses in every district
Impact of Coverage Gaps
- 90% coverage: Outbreaks still occur, vulnerable populations at risk
- 80% coverage: Regular outbreaks in susceptible subgroups
- 70% coverage: Endemic transmission continues
- <50% coverage: High endemic burden, frequent epidemics
Future Iteration Possibilities
Iteration 2 (Intermediate):
- Add auto-play timeline animation
- Show trend indicators (up/down arrows) for coverage changes
- Regional filtering buttons
Iteration 3 (Advanced):
- Country detail panels with Chart.js time series graphs
- Outbreak event markers (major epidemics)
- Comparison mode (two years side-by-side)
Iteration 4 (Expert):
- Herd immunity threshold overlay (95% line)
- Predictive modeling: future outbreaks based on coverage gaps
- API integration with WHO/UNICEF live data
- Animated transitions between years showing coverage waves
Data Sources & Methodology
Based on:
- WHO/UNICEF Estimates of National Immunization Coverage (WUENIC)
- WHO Measles Surveillance Data
- Global Burden of Disease Study
- World Bank Development Indicators
Note: Data in this visualization is synthetically generated for demonstration purposes, using realistic parameters from authoritative sources. Actual coverage estimates, case counts, and mortality data should be obtained from WHO and national health authorities for real-world analysis.
Usage
Open index.html in a modern web browser (Chrome, Firefox, Safari, Edge). Use the timeline slider to explore vaccination coverage across different years. Hover over countries to see detailed statistics. Rotate and zoom the globe to focus on regions of interest.
Iteration: 1 of infinite (Foundation Level) Disease: Measles (MCV1/MCV2) Countries: 60 Time Period: 2000-2023 Web Source: https://docs.mapbox.com/mapbox-gl-js/example/popup-on-hover/ Pattern Applied: Hover popup with mouseenter/mouseleave events