The Seismic Lottery: When Infrastructure Matters More Than Magnitude 🌍

An interactive data visualization project that explores the relationship between earthquake magnitudes and their impact on different regions, emphasizing how infrastructure resilience plays a crucial role in determining the outcome of seismic events.

Overview 📊

This project presents an engaging narrative about earthquakes and their varying impacts across different regions. It demonstrates how the same magnitude earthquake can have drastically different outcomes depending on the infrastructure and preparedness of the affected area.

Features 🌟

Interactive Globe Visualization

• Real-time 3D globe visualization of earthquake data
• Toggle between magnitude and casualty views
• Auto-rotation capability
• Interactive tooltips with detailed earthquake information

Educational Story Section

1. Earthquake Mechanics

   • Visual explanation of tectonic pressure buildup
   • Interactive demonstration of energy release
   • Historical context and scientific background

2. Energy Calculator

   • Compare earthquake energy with nuclear explosions
   • Interactive magnitude and depth controls
   • Historical earthquake database
   • Visual representation of energy equivalence

3. Prediction Interface

   • Interactive tool for users to predict earthquake impact
   • Real-time correlation analysis
   • Comparison with actual data

Technical Stack 💻

• Frontend: HTML5, CSS3, JavaScript
• Visualization Libraries:
  • D3.js (v7) for data visualization
  • TopoJSON for geographic data
  • Scrollama for scroll-based animations
• Fonts: Inter (Google Fonts)
• Media: Custom video content for educational sections

Setup Instructions 🚀

1. Clone the repository:

   git clone [repository-url]
   cd earthquakes

2. Ensure all dependencies are available:

   • D3.js v7
   • TopoJSON v3
   • Scrollama
   • Google Fonts (Inter)

3. Open index.html in a modern web browser

Project Structure 📁

earthquakes/
├── index.html          # Main HTML file
├── style.css          # Main stylesheet
├── styles.css         # Additional styles
├── script.js          # Main JavaScript file
└── and-story/         # Video assets for educational section
    ├── and_part1.mp4
    ├── and_part2.mp4
    └── and_part5.mp4

Features in Detail 🔍

Globe Visualization

• Interactive 3D globe showing earthquake data

• Color-coded visualization based on magnitude or casualties

• Detailed tooltips with:

  • Earthquake magnitude

  • Number of casualties

  • Date of occurrence

  • Location information

Energy Calculator

• Real-time energy calculations

• Comparison with historical earthquakes

• Visual representation using nuclear bomb equivalents

• Interactive sliders for magnitude and depth

• Comprehensive database of historical earthquakes

Educational Content

• Step-by-step explanation of earthquake mechanics

• Visual demonstrations of tectonic processes

• Statistical information about earthquake characteristics

• Interactive elements for better understanding

Contributors 📧

• Chinmay Bharambe
• Ishaan Gosain
• Praveen Sharma
• Vedant Vardhaan