Choropleth Map with Interactive Filtering

100%

Choropleth Map with Interactive Filtering

✓ Published1🌍 Public

Last edited Sep 20, 2019

Created on Sep 20, 2019

Forked from Choropleth Map with Interactive Filtering

A choropleth map displays countries colored by economic grouping, with a legend of color categories that users can click to highlight matching regions and fade all others. The map uses a natural Earth projection via `d3.geoNaturalEarth1` and `d3.geoPath`, while the legend employs scale-ordinal colors from `schemeSpectral` and interactive click handlers. Panning and zooming are enabled through `d3.zoom`. The geographic data comes from the World Atlas TopoJSON, with ISO country mappings joined from TSV metadata.

AI-generated description

A choropleth map where you can hover over items in the color legend items to interactively filter!

MIT Licensed

Similar vizzes

Loading thumbnail…

Choropleth Map with Interactive Filtering

A world choropleth map colors countries by economic classification using a categorical ordinal scale. Clicking a legend item filters the map, dimming unselected countries and highlighting the chosen category while clicking again resets the view. The visualization is built with D3 v5, using `geoNaturalEarth1` and `geoPath` for map projection and rendering, with pan and zoom enabled via `d3.zoom`. Data comes from the World Atlas TopoJSON, and the legend uses SVG circles with click handlers.

Ccodexmon

96% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map displays world countries colored by an economic attribute, with interactive filtering that highlights selected categories and dims others. The map uses a natural Earth projection with a shadowed sphere, while a clickable color legend controls which categories remain prominent. Built with D3 v5, the visualization uses `d3.geoPath`, `d3.geoNaturalEarth1`, and an ordinal color scale based on spectral schemes. Data is loaded from the world-atlas TopoJSON and TSV files, with zooming enabled via D3's `zoom` component.

HHasideluxe

96% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map displays countries colored by economic classification, with a legend of color swatches. Clicking a legend item filters the map to highlight only countries in that category, dimming all others, while hovering over a legend item reveals its effect. Built with D3 v5, the visualization uses `geoNaturalEarth1` and `geoPath` for the map projection and rendering, plus `scaleOrdinal` with `schemeSpectral` for colors. Geographic data comes from the World Atlas TopoJSON and TSV files.

RRamazan YAGMUR

96% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map colors countries by economic classification using D3's `geoNaturalEarth1` projection and `geoPath`, with an ordinal color scale from `schemeSpectral`. Clicking a legend item filters the map by highlighting matching countries and dimming others, while the sphere fades to emphasize the selection. The visualization loads country boundaries from TopoJSON world-atlas data and supports pan and zoom via `d3.zoom`, with tooltips showing country names and values.

YYF

95% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map displays world countries colored by economic classification, with an interactive legend that filters which countries remain highlighted. Users click legend categories to isolate specific economic groups, dimming non-matching countries to 10% opacity. The visualization uses d3.geoNaturalEarth1 and d3.geoPath for map projection, d3.zoom for panning, and a d3.scaleOrdinal with schemeSpectral for coloring. Data combines TopoJSON world geometry with TSV metadata from the world-atlas package. The SVG rendering supports hover effects and a legend built with custom SVG groups and circles.

Ggabcoderboi

95% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map of global economic data, colored by country using a spectral ordinal scale, lets viewers filter countries by clicking a color legend. The map renders with an SVG projection via `d3.geoNaturalEarth1` and `d3.geoPath`, supporting pan and zoom through `d3.zoom`. Legend clicks toggle highlighting of matching countries, dimming others. Country data merges TopoJSON geometries with TSV attributes from the world-atlas dataset, and legend interactions redraw both map and legend.

Iianleekq

95% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map shows world countries colored by economic development group, with an interactive color legend that filters which regions remain highlighted. Users click legend items to isolate a category, dimming all other countries and brightening the selected ones. The map uses a natural Earth projection via `d3.geoPath` and `geoNaturalEarth1`, with country boundaries drawn from TopoJSON data. The legend is built with D3 scales and SVG circles, while `d3.zoom` enables panning and zooming on the map.

Kkasalwelengwe@gmail.com

95% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map displays countries colored by economy group, with an interactive color legend that filters the map by hover or click. Clicking a legend item highlights matching countries and dims the rest, while clicking again clears the filter. The visualization uses d3.geoPath with a geoNaturalEarth1 projection for country shapes, d3.scaleOrdinal with a schemeSpectral range for coloring, and loads world data from the world-atlas package. A d3.zoom interaction supports panning and zooming the map.

Ccaydener

95% match