Skip to main content
SimilarExport ZIP
100%

Choropleth Map

✓ Published0🌍 Public
NNita
Last edited Mar 24, 2020
Created on Mar 24, 2020
Forked from Choropleth Map

This choropleth map displays global population estimates for 2018, with countries colored in a blue scale on an orthographic projection of the world. The visualization uses `d3.geoOrthographic` to project countries and `d3.geoPath` to render their shapes, while a `d3.scaleSqrt` encodes population counts as circle radii for select countries. Data comes from the UN population estimates CSV and a world TopoJSON, processed with `topojson.feature`. Interactivity includes zooming via `d3.zoom` and a color legend, rendered as SVG.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Choropleth Map

A choropleth map visualizes population estimates per country for 2018, with each country shaded and overlaid with proportional circles sized by population magnitude. The visualization uses a natural Earth projection via `d3.geoPath` and `geoNaturalEarth1`, while `topojson.feature` loads world geometry. Population data comes from a CSV file, and a square-root scale sizes the circles. The map supports zooming through `d3.zoom`, and legends for color and size are built with custom SVG components. Hovering highlights countries and shows population in a tooltip.

Kkasalwelengwe@gmail.com
90% match
Loading thumbnail…

Chloropleth Map

This choropleth map visualizes global population estimates for 2018, using circle size to represent population magnitude overlaid on country boundaries. The visualization employs d3.geoNaturalEarth1 projection with d3.geoPath for rendering geographic features, while circles are positioned via d3.geoCentroid. Data from the UN population estimates is merged with TopoJSON world atlas geometry. Interactive zooming is implemented with d3.zoom, and a custom size legend communicates the population scale using d3.scaleSqrt.

TThomas Seberechts
90% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes global population estimates for 2018, using circle size to represent population and color to indicate economic classification. The map renders countries as SVG paths via d3.geoPath with a natural Earth projection, while population circles are positioned using d3.geoCentroid and scaled with d3.scaleSqrt. The visualization employs d3.zoom for panning and zooming, d3.scaleOrdinal with schemeSpectral for the color legend, and loads data from TopoJSON world atlas and UN population CSV files. Hovering highlights countries in red.

LLiuXiangYuan
89% match
Loading thumbnail…

Choropleth Map

This choropleth map displays global population data from the UN’s 2019 dataset, coloring each country according to its population value. The visualization uses D3’s geoMercator projection and geoPath to render country outlines from World Atlas TopoJSON data, while the D3 scaleOrdinal and schemeSpectral functions generate the color scale. A custom color legend shows the mapping between colors and population values, and hovering over a country highlights it in red.

SSophia Murage
89% match
Loading thumbnail…

Fork of Choropleth Map

This choropleth map visualizes global population estimates by country, using color to represent values from a UN population dataset. Users can click color legend items to highlight specific regions, which dims all other countries. The visualization uses d3.geoPath with a geoNaturalEarth1 projection, d3.zoom for panning, and d3.scaleOrdinal with schemeSpectral for coloring. TopoJSON data is processed via d3.json and the topojson feature API, while the SVG rendering includes interactive tooltips showing country names and values.

JJuyeonee
85% match
Loading thumbnail…

Choropleth World population map

A choropleth world map visualizes population data by country, using sequential color intensity from a threshold color scale to represent population magnitude. The visualization employs a Robinson projection to render the geographic layout, with each country's fill color derived from a CSV dataset joined to the GeoJSON map data. Interactive features include tooltips on hover, displaying the country name and calculated population in millions, while click and hover events trigger opacity and stroke changes. The implementation utilizes d3.geoPath for map drawing, d3.scaleThreshold for color classification, and d3.queue for asynchronous data loading, all rendered as SVG elements within a styled HTML container.

Vvishusikka
85% match
Loading thumbnail…

chloropleth

This choropleth map displays global population by country, with a blue color scale indicating population ranges. Built with d3.js, it uses `d3.geoMercator` for projection and `d3.geoPath` to draw country boundaries from a GeoJSON dataset. Population data from a CSV file is matched to each country via a `Map`, and `d3.scaleThreshold` maps values to a color scheme. Hovering over a country triggers a transition that dims other countries and highlights the selected one with a black stroke.

Hhanulik.ondrej@gmail.com
85% match
Loading thumbnail…

Choropleth map

This choropleth map displays global population data by country, with a threshold color scale using `d3.scaleThreshold` and `d3.schemeBlues`. The example loads world GeoJSON topology and population CSV data via `d3.json` and `d3.csv`, rendering the map with `d3.geoPath` and a Mercator projection. Interactive buttons allow switching between music genres, though the map itself does not respond to these selections. The visualization uses D3 v4 and SVG rendering within a 400x300 viewport.

Ffkara09
84% match