Skip to main content
SimilarExport ZIP
100%

Choropleth Map with Interactive Filtering

✓ Published0🌍 Public
AAmar Nath Yogi
Last edited Feb 2, 2020
Created on Feb 1, 2020
Forked from Choropleth Map

This choropleth map displays world economies with colors from a spectral scale, letting users filter countries by clicking legend categories to dim non-matching regions. The visualization uses a natural Earth projection rendered as SVG paths via `d3.geoPath`, with geographic data from the world-atlas package and economic classifications from a TSV file. Interactive zooming and panning are enabled through `d3.zoom`, while legend clicks toggle color-based highlighting, emphasizing selected economy types while reducing opacity of unrelated countries.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map displays world economies using a spectral color scale, with each country colored according to its economic classification. Users can click legend items to filter the map, highlighting countries matching the selected economy while dimming others. The visualization uses D3 v5 APIs including `d3.geoPath`, `d3.geoNaturalEarth1`, `d3.scaleOrdinal`, and `d3.schemeSpectral` to render SVG paths. Data comes from a World Atlas TopoJSON file joined with TSV metadata, and interactive zooming is enabled through D3's `zoom` event system.

RRoger Yu-Hsiang Lo
96% match
Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map visualizes the world's economies, coloring each country according to its economic classification. Users can zoom and pan the map via `d3.zoom`, while the color legend offers an interactive click handler, though its filtering effect is not implemented. The visualization loads geographic data from the world-atlas TopoJSON and TSV files, using `d3.geoPath` with a `geoNaturalEarth1` projection to render countries as SVG paths. A spectral color scale maps economy categories to hues, and hovering highlights a country in coral.

MMichał Szumnarski
96% match
Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map displays global economies using color-coded countries, with interactive filtering through a clickable color legend. Hovering over legend items dims non-matching countries, while clicking toggles filtering and highlights selected categories. The visualization uses d3.geoPath with a geoNaturalEarth1 projection for map rendering, d3.scaleOrdinal with schemeSpectral for coloring, and d3.zoom for panning. Data comes from TopoJSON world-atlas files, with country names and economy classifications merged from TSV metadata.

Sszy1900
95% match
Loading thumbnail…

Choropleth Map with Interactive filtering

This choropleth map displays world economies using a color gradient, with an interactive legend that filters countries by economic category. Users can zoom and pan the map, and clicking a legend entry dims non-matching countries while highlighting the selected group. The visualization uses d3.geoNaturalEarth1 projection, d3.geoPath for rendering SVG paths, and d3.zoom for navigation. Data comes from the world-atlas TopoJSON and TSV datasets, with unemployment type and population shown in tooltips. The color scale uses d3.schemeSpectral, and legend interactions are handled through d3 event listeners.

Jjlongwellchc
95% match
Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map visualizes world economies by color-coding countries according to their economic classification. Users can click legend categories to filter the map, highlighting matching countries while dimming others; clicking again resets the filter. The map uses d3.geoNaturalEarth1 projection and d3.geoPath for rendering, while d3.scaleOrdinal with d3.schemeSpectral supplies the color scale. Data comes from the world-atlas dataset, loaded via d3.tsv and topojson.feature.

KKarkG
95% match
Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map shows global economic data by country, with an interactive color legend that filters countries by economy category. Users click legend items to highlight matching countries and fade others, and they can hover over countries to see their name and value in a tooltip. The map uses a natural Earth projection via `d3.geoNaturalEarth1` and `d3.geoPath`, with a spectral ordinal color scale, while the legend and map both respond to clicks through D3's event handling. World country boundaries and metadata come from the world-atlas package, loaded via `d3.tsv` and `d3.json`.

Eenzo121
94% match
Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map shows global economic data by country, with an interactive color legend that filters countries by economy category. Users click legend items to highlight matching countries and fade others, and they can hover over countries to see their name and value in a tooltip. The map uses a natural Earth projection via `d3.geoNaturalEarth1` and `d3.geoPath`, with a spectral ordinal color scale, while the legend and map both respond to clicks through D3's event handling. World country boundaries and metadata come from the world-atlas package, loaded via `d3.tsv` and `d3.json`.

Eenzo121
94% match
Loading thumbnail…

Choropleth Map with Interactive filtering

This choropleth map of world economies uses color to encode categorical economic data, with an interactive legend that filters which countries are highlighted. Clicking a legend value dims all countries not in that category while emphasizing those that match. The visualization is built with d3.geoPath and d3.geoNaturalEarth1 for map projections, d3.scaleOrdinal with schemeSpectral for coloring, and a custom colorLegend component with click handlers. Country data comes from World Atlas TopoJSON and TSV files, rendered as SVG paths.

NNico Donovan
94% match