Skip to main content
SimilarExport ZIP
100%

Choropleth Map

✓ Published1🌍 Public
NNita
Last edited Mar 24, 2020
Created on Mar 23, 2020
Forked from Untitled

This choropleth map visualizes the global distribution of esports participation using a spherical orthographic projection, with country counts represented by dark blue circles overlaid on a grey base map. The visualization is built with D3 v5, using `d3.geoOrthographic` for the projection, `d3.geoPath` for rendering country boundaries, and `d3.geoCentroid` to position circles at country centers. It loads population data from a CSV and world geometry from a TopoJSON file, with a color legend showing the circle radius scale. Zooming is supported via D3's zoom utility, and circle sizes are scaled by the square root of the 2018 user counts.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

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.

NNita
82% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes country-level scalar data using color-coding over a geographical projection. Built with D3.js, it renders SVG paths from TopoJSON world data, with the projection handled by `d3.geoPath` and `d3.geoNaturalEarth1`. The map assigns colors based on a `scalerank` attribute using a `d3.scaleOrdinal` color scale, while a supplementary color legend displays the mapping. Interactivity is included via a zoom feature, and hovering over a country highlights it and displays a tooltip with its name and value.

SSean Ye
79% match
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
79% match
Loading thumbnail…

Choropleth Map

A choropleth map displays countries of the world colored in light green, with a blue sphere representing the globe and black borders between nations. The visualization uses `d3.geoNaturalEarth1` projection and `d3.geoPath` to render geographic features from TopoJSON data, while country names come from tab-separated values (TSV) data. Interactive zooming is implemented with `d3.zoom`, converting events to SVG transforms. Hovering over a country changes its fill color to red through CSS `:hover` styles, and tooltips with country names appear via SVG `title` elements.

Yyouer
79% match
Loading thumbnail…

Circles on a Map

A choropleth-style map of global population for 2020, where each country is positioned using the D3 `geoNaturalEarth1` projection and drawn with `d3.geoPath`. Circle markers, sized with a `d3.scaleSqrt` legend, indicate relative population per country, and users can pan and zoom via `d3.zoom`. The visualization also includes a color legend built with the `colorLegend` module and a size legend using `tickFormat`, with data loaded from a CSV and a TopoJSON world atlas.

Jjesramyep1263
79% match
Loading thumbnail…

Choropleth Map

This choropleth map displays world countries using a natural Earth projection, with country boundaries rendered as interactive SVG paths. The visualization uses D3 v6 and TopoJSON to load and convert world-atlas data from unpkg, employing `d3.geoNaturalEarth1` and `d3.geoPath` for projection and path generation. Hovering over a country changes its fill from green to red, while a zoom behavior (`d3.zoom`) allows panning and scaling the entire map. The sphere background is filled blue, and country names appear as tooltips via SVG title elements.

BBKirst3
78% 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
78% match
Loading thumbnail…

Choropleth Map

This choropleth map visualizes world countries using a natural Earth projection, with color encoding driven by data loaded from the world-atlas TopoJSON and TSV files. The SVG rendering uses `d3.geoNaturalEarth1` and `d3.geoPath` to draw geographic features, while an ordinal color scale maps country attributes to fill colors. Interactive pan and zoom are enabled through `d3.zoom`, which transforms both the map and sphere layers. A color legend is positioned on the left side to interpret the scale.

YYoung Song
78% match