worldmap2

100%

✓ Published1🌍 Public

Hhxc20060903

Last edited Jan 1, 2021

Created on Jan 1, 2021

Forked from worldmap

This example shows a choropleth map of the world colored by each country’s economy type, with an interactive legend that filters highlighted countries. The visualization uses d3.geoNaturalEarth1 projection and d3.geoPath to render country features from TopoJSON data loaded via d3.json and d3.tsv. Users can click legend items to toggle selection, and d3.zoom enables panning and zooming on the SVG map.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

world map

This example shows a choropleth world map colored by each country's economy classification, with a clickable color legend that filters and highlights matching countries while dimming others. The map uses d3.geoNaturalEarth1 and d3.geoPath to render TopoJSON world-atlas data, with d3.zoom enabling pan and zoom interactions. A d3.scaleOrdinal maps the spectral color scheme to the economy categories, and tooltips display country names and values. The SVG rendering includes CSS hover effects and opacity transitions for non-selected regions.

Zzhangfa

90% match

Loading thumbnail…

world map

A choropleth map of world countries colored by economy category, with an interactive legend that filters the map when clicking a category. Hovering a country displays its name and value via a tooltip. The visualization uses D3 v5 with d3.geoNaturalEarth1 projection, d3.geoPath for rendering, and d3.zoom for pan and zoom. Data comes from the world-atlas TopoJSON and TSV files, processed with topojson.feature and d3.tsv.

BBajiSharifPatan@my.unt.edu

89% match

Loading thumbnail…

Choropleth map with interaction

This choropleth map displays world economies using a color scale mapped to each country, with dimming and highlighting applied when a legend category is selected. Built with D3 v5, it uses `d3.geoNaturalEarth1` and `d3.geoPath` for projection and rendering, and `d3.zoom` for panning and zooming. A clickable legend, rendered via custom D3 selections, filters the map by economy type, while data is loaded from TopoJSON and TSV files using `d3.json` and `d3.tsv`. The map renders as SVG with hover effects and interactive focus.

JJasonYeong0821

87% match

Loading thumbnail…

world map with colors

This interactive choropleth map colors each country by its economy category, using a spectral color scale and click-to-highlight interaction to compare regions. Built with D3 v5, it renders country outlines via `d3.geoPath` with a Natural Earth projection, loads TopoJSON country boundaries from the World Atlas, and joins economic classifications from a TSV file. A zoom behavior enables panning and scaling, while an ordinal color legend supports filtering by clicking a category to fade unmatched countries.

BBajiSharifPatan@my.unt.edu

87% match

Loading thumbnail…

choropleth ... map

A choropleth map of world countries colored by economy type, using a spectral color scale with an interactive legend. The map displays country names and economy values on hover, with zoom and pan enabled via d3.zoom. Built with d3.geoNaturalEarth1 projection and d3.geoPath, it loads TopoJSON and TSV data from world-atlas, renders as SVG, and uses d3.scaleOrdinal to map values to colors.

YYanxxx447

87% match

Loading thumbnail…

Untitled

This example displays a world choropleth map colored by each country’s economy category, with an interactive legend that filters and highlights selected categories. It uses d3.geoPath and d3.geoNaturalEarth1 for geographic rendering from TopoJSON data loaded via topojson.feature, with d3.scaleOrdinal and schemeSpectral mapping categories to colors. The legend and map respond to clicks, adjusting opacity and stroke widths, while d3.zoom enables panning and zooming.

MMukund Khandelwal

86% match

Loading thumbnail…

Chloropleth Map Interactive

A choropleth map shows world countries colored by economy type, with a legend that filters and highlights selected categories. The visualization supports zooming and panning, and dims non-selected countries while emphasizing those matching the chosen economy. It uses d3.geoPath with the geoNaturalEarth1 projection to render the map, and d3.scaleOrdinal with schemeSpectral for coloring. Country data comes from world-atlas TopoJSON and TSV files, with hover effects and a clickable color legend for interaction.

MMaxwell Dayvson da Silva

86% match

Loading thumbnail…

Choropleth Map

This choropleth map colors countries by their economy type using a categorical color scale, with a legend showing each category. It renders world geography as SVG paths via `d3.geoPath` and the Natural Earth projection, while `d3.zoom` enables panning and zooming. The code loads TopoJSON and TSV data from the world-atlas package, mapping country IDs to economy labels, and uses `d3.scaleOrdinal` with `schemeSpectral`. Hovering highlights a country in red.

Ggabcoderboi

86% match