Choropleth Map with Interactive Filtering

100%

Choropleth Map with Interactive Filtering

✓ Published0🌍 Public

Last edited Oct 24, 2018

Created on Oct 24, 2018

Forked from Choropleth Map with Interactive Filtering

This interactive choropleth map shows world countries colored by name, with a clickable legend that filters the map to highlight a selected country while dimming others. The visualization uses D3 v5 with `geoNaturalEarth1` projection and `geoPath` for rendering countries, and `d3.zoom` for pan and zoom. Data combines CSV attributes with TopoJSON country boundaries, while the ordinal color scale uses `schemeSpectral`. Clicking a legend item toggles the filter, adjusting opacity and stroke width for highlighted countries.

AI-generated description

MIT Licensed

Similar vizzes

Loading thumbnail…

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.

Ccaydener

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

93% match

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

93% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map displays world countries colored by economic classification, with an interactive color legend that filters the map when clicked. Hovering reveals country names and values via tooltips, while non-selected countries and legend items fade to low opacity. The visualization uses d3.geoNaturalEarth1 with d3.geoPath for projected SVG rendering, d3.scaleOrdinal with schemeSpectral for color mapping, and d3.zoom for panning. Data comes from the world-atlas TopoJSON and TSV files, processed through topojson.feature. Clicking a legend item toggles filtering on that value.

Wwindwardpassage

93% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map shows countries colored by economic grouping, with a color legend that filters the map when clicked. Clicking a legend item dims unselected countries and highlights those matching the chosen category. The visualization uses d3.geoPath with d3.geoNaturalEarth1 for projection, d3.zoom for panning, and d3.scaleOrdinal with schemeSpectral for colors. Country boundaries come from the world-atlas TopoJSON dataset, with hover effects and tooltips showing country names and values.

Fftjyangf

93% match

Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map displays world countries colored by economic classification, with an interactive color legend that filters which countries remain highlighted. Clicking a legend item dims all countries not in that category, while clicking the same item again clears the filter. The visualization uses d3.geoNaturalEarth1 for projection, d3.geoPath for rendering SVG paths, d3.scaleOrdinal with a spectral scheme for coloring, and d3.zoom for pan and zoom. Data comes from the world-atlas TopoJSON and TSV datasets, loaded via d3.json and d3.tsv.

Llystran

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

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

93% match