Circles on a Map

100%

Circles on a Map

✓ Published0🌍 Public

Last edited Jul 31, 2020

Created on Jul 31, 2020

This map visualization displays global population estimates for 2020 using circles sized by population magnitude and overlaid on a geographic projection. Countries are colored green if they have population data, red otherwise. The visualization uses d3.geoNaturalEarth1 for the map projection, d3.geoPath to render country boundaries, and d3.scaleSqrt for circle radii based on population values. Data comes from UN Population Estimates 2017 Medium Variant, processed with TopoJSON and d3.csv, with zoom functionality via d3.zoom.

AI-generated description

(UN Population Estimates 2017 Medium Variant)[https://population.un.org/wpp/Download/Files/1_Indicators%20(Standard)/EXCEL_FILES/1_Population/WPP2019_POP_F01_1_TOTAL_POPULATION_BOTH_SEXES.xlsx]

MIT Licensed

Similar vizzes

Loading thumbnail…

Circles on a Map

This visualization shows world population data from the UN Population Estimates 2017 medium variant, with each country colored green or red based on population presence and scaled circles representing 2018 population values. The map uses D3’s geoNaturalEarth1 projection with geoPath to render countries, and geoCentroid to position circles at country centers. Circle sizes are determined by a d3.scaleSqrt radius scale, while a color legend is generated using custom update patterns. The visualization supports zooming via d3.zoom and includes hover highlighting on countries. Data is loaded and processed from CSV and TopoJSON sources using d3.csv and topojson.feature.

JJuyeonee

95% match

Loading thumbnail…

Circles on a Map

This map visualizes global population estimates for 2022, with each country represented by a circle sized by its population and positioned at its centroid. The visualization uses D3's `geoNaturalEarth1` projection and `geoPath` to render the map, while `scaleSqrt` scales the circle radii. A size legend and color legend, built with reusable D3 modules, explain the encoding. Population data comes from a UN CSV file, and the map uses TopoJSON from the VisionsCarto World Atlas.

HHasideluxe

94% match

Loading thumbnail…

Circles on A Map

This visualization displays global population estimates for 2018 by drawing semi-transparent circles on a natural Earth projection map, with each circle positioned at a country's centroid and sized proportionally to its population. The map also includes a size legend and color legend for reference. Built with D3 v5, it uses `d3.geoNaturalEarth1` and `d3.geoPath` for map rendering, `d3.scaleSqrt` for circle sizing, and `d3.zoom` for interactivity. Population data comes from a UN dataset, with geographic boundaries from TopoJSON, and all elements are rendered as SVG.

MMuhammad Jarir Kanji

94% match

Loading thumbnail…

Circles on a Map

This visualization displays global population estimates for 2018, using a natural Earth projection to map countries. The map uses semi-transparent circles sized by population magnitude, while a color legend and size legend clarify the encoding. Built with D3 v5, the code leverages `geoNaturalEarth1` and `geoPath` for map projection, `scaleSqrt` for circle sizing, and `scaleOrdinal` for the color scheme. Data is sourced from UN population estimates joined with a TopoJSON world atlas. A tooltip on each country provides its name and population count, with missing data highlighted in light red.

MMatthiasVanCampen

94% match

Loading thumbnail…

Circles on a Map

This example visualizes global population estimates for 2018 using circles overlaid on a natural Earth projection map. Countries with missing data appear pink, while populated areas are gray with semi-transparent cyan circles sized by population via d3.scaleSqrt. The visualization includes an interactive size legend with formatted tick values and a color legend. It uses d3.geoPath, d3.geoCentroid, d3.zoom, and d3.scaleOrdinal, rendering with SVG. Population data comes from a UN CSV file joined to TopoJSON world geometry, with tooltips showing country names and population counts.

Ffloresh

94% match

Loading thumbnail…

Circles on a Map

This visualization shows global population estimates for 2018 as colored circles positioned at the geographic centroid of each country on a natural Earth projection. A size legend encodes population magnitudes, while a color legend maps a categorical scale, with countries lacking data highlighted in a different shade. The code uses d3.geoPath and d3.geoCentroid for map rendering, d3.scaleSqrt for circle sizing, and d3.scaleOrdinal with a spectral scheme for colors. Population data comes from a UN CSV dataset, joined to country geometries from a TopoJSON world atlas. Users can pan and zoom via d3.zoom, with hover tooltips showing region names and formatted population counts.

NNita

94% match

Loading thumbnail…

Circles on a Map

This visualization displays global population estimates for 2018 as proportional circles positioned at country centroids on a natural Earth projection map. Country boundaries are rendered as paths using d3.geoPath, while circle radii scale with population via d3.scaleSqrt. Two legends—a size legend and a color legend—communicate the quantitative mapping, with colors assigned through d3.scaleOrdinal. The map supports zooming through d3.zoom, and data comes from United Nations population estimates loaded as CSV and TopoJSON, processed with topojson.feature.

HHe Jianfeng

94% match

Loading thumbnail…

Circles on a Map

This map visualization displays global population by country using semi-transparent circles sized proportionally to 2018 population data from the UN, with a square-root scale for area encoding. The code uses d3.geoNaturalEarth1 projection, d3.geoPath, and d3.geoCentroid to position circles at country centroids, while d3.zoom enables panning and zooming. Hovering reveals country names and population values via SVG title elements, and a custom size legend explains the circle scaling. Data sources include UN population CSV and TopoJSON world atlas geometry.

Jjesramyep1263

94% match