Viewing a saved revision (read-only)
5b5823f29deb4c12a047c7ba6ede8a5b
Treemap - Global Data
This interactive treemap visualizes global metrics—such as CO₂ emissions, population, and GDP—for countries grouped by region, with a dropdown to switch between twelve data dimensions. Built with D3.js, it uses `d3.treemap` and `d3.hierarchy` to compute the layout and `scaleSequential` with `interpolateWarm` for color encoding. Hovering reveals a tooltip with region, country, and metric-specific values. The viz renders as SVG, sourcing data from a bundled global dataset.
AI-generated descriptionTreemap Visualization
Overview
This project is an interactive treemap visualization built using D3.js. It dynamically displays various metrics for countries grouped by regions, allowing users to explore data such as CO₂ emissions, population, GDP, and more. The visualization enables insights into hierarchical data with user-friendly interactivity.
Features
- Dynamic Metric Selection: A dropdown menu allows users to switch between metrics like CO₂ emissions, population, GDP, and others.
- Interactive Tooltip: Displays region, country, and the value of the selected metric with appropriate units on hover.
- Responsive Design: Adjusts to the size of the container for seamless integration into different layouts.
- Color-Coded Regions: Treemap uses a warm color gradient to represent the magnitude of values visually.
- Hierarchical View: Groups countries by their respective regions for better contextual understanding.