Skip to main content
🌍 Public

Share visualization

Send this visualization to others.

Circles on a Map

Public visualization

Viewing a saved revision (read-only)

3b7fc7b283714b85bb0399f4447b1178

Circles on a Map

0 stars0🌍 Public
KKevinw97
Last edited Feb 12, 2020
Created on Feb 12, 2020
Forked from Circles on a Map

This visualization displays global population data for 2018 using proportional circles centered on each country, with area encoding population size. The map supports pan and zoom, and hovering reveals a tooltip with the country name and exact population. It uses a natural Earth projection via d3.geoNaturalEarth1, with d3.geoPath for country boundaries and d3.scaleSqrt for circle sizing. A custom size legend and color legend (d3.scaleOrdinal with schemeSpectral) provide context. Data comes from a CSV file merged with world topology from TopoJSON, rendered as SVG. The implementation uses d3.zoom for interaction and d3.geoCentroid to position circles.

AI-generated description

Visualizing population by country using circles on a map! The area of each circle corresponds to the population of the country it represents. You can also pan & zoom, and hover over each country for more information.