Choropleth Map

100%

Choropleth Map

✓ Published1🌍 Public

Last edited Jul 16, 2019

Created on Jul 16, 2019

This choropleth map displays world countries on a natural Earth projection, colored uniformly with a light green fill on a blue sphere. It uses the `geoNaturalEarth1` projection and `geoPath` from d3 to generate the geographic paths from TopoJSON world data. The visualization supports zooming and panning via the custom `zoom` event, while hovering over a country turns it red. Data is loaded from the world-atlas package, which provides both TSV metadata and TopoJSON geometry.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

Choropleth Map

This choropleth map visualizes world countries with a green fill and a blue sphere background, using a natural Earth projection rendered to SVG. It draws country boundaries and names from the world-atlas TopoJSON dataset, with each country’s name displayed as a tooltip. The map supports pan and zoom via d3.zoom, and hovering over a country turns it red. The code leverages d3.geoNaturalEarth1, d3.geoPath, and topojson.feature to generate the geographic paths.

Ccpsshan

95% match

Loading thumbnail…

Choropleth Map

This choropleth map visualizes world countries using a natural Earth projection, with each country filled in light green and outlined in black. The visualization loads geographic data from the World Atlas TopoJSON and TSV files, using `d3.geoPath` and `geoNaturalEarth1` to project and render country boundaries. Countries are colored by their assigned fill, and hovering over a country turns it red, while a tooltip displays the country name. The map includes a blue sphere background and supports zoom interactions through D3’s zoom behavior.

Yylzami40

95% match

Loading thumbnail…

Choropleth Map

This choropleth map displays world countries colored in light green against a blue sphere, with hover highlighting in red. It uses a natural Earth projection via `d3.geoPath` and `geoNaturalEarth1` to render country boundaries from TopoJSON data sourced from the world-atlas package, paired with a TSV file for country names. Pan and zoom interactions are enabled through `d3.zoom`, while tooltips show country names via SVG `title` elements.

CChip

95% match

Loading thumbnail…

Choropleth Map

This choropleth map displays world countries as red-filled paths on a blue sphere using a natural Earth projection, with hover effects changing the fill to red. The visualization employs D3 v5’s `geoPath` and `geoNaturalEarth1` for geographic rendering, and TopoJSON’s `feature` to convert world-atlas 50m topology into GeoJSON. Data from a TSV file is merged with country IDs to attach country names for tooltips. The map supports zooming via D3’s `zoom` behavior, applying transforms to the SVG group.

Pprincit

94% match

Loading thumbnail…

Choropleth Map

This choropleth map displays world countries as a stylized green landmass on a blue sphere, using a natural Earth projection. It renders with D3’s `geoPath` and `geoNaturalEarth1` projection onto an SVG, powered by TopoJSON world-atlas data. Hovering highlights a country in red, while a tooltip shows the country name from a TSV lookup. Pan and zoom are enabled via `d3.zoom`.

LLex

94% 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

94% 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

93% 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

93% match