HW5 - Marks and Channels

A React + D3 visualization showing the relationship between GDP per capita and CO2 emissions per capita across different countries.

Visualization Features

• X Axis: GDP per Capita (USD)
• Y Axis: CO2 per Capita (metric tons)
• Mark: Circles
• Size Channel: Population (millions)
• Color Channel: Region (Asia, Europe, North America, South America, Oceania)

Files

• App.jsx - Main React component
• viz.js - Visualization orchestrator
• renderScatter.js - D3 scatter plot renderer
• data.js - Sample country data
• styles.css - Styling
• index.jsx - React entry point
• index.html - HTML template

Running