Skip to main content
SimilarExport ZIP
100%

Choropleth Map Interactive

✓ Published0🌍 Public
MMunTatt Yap
Last edited Aug 30, 2019
Created on Aug 17, 2019
Forked from Choropleth Map

This interactive choropleth map displays countries colored by their economy category, using a spectral color scale and a natural Earth projection. Users can click legend swatches to highlight matching regions while dimming others. The visualization is built with D3 v5 modules including `geoNaturalEarth1`, `geoPath`, and `zoom`, rendering vector shapes as SVG. It loads geographic data from the World Atlas TopoJSON and TSV files, processing them via `topojson.feature`. A dedicated color legend component supports selection filtering, while CSS hover effects emphasize individual countries.

AI-generated description
MIT Licensed

Similar vizzes

Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map colors world countries by their economy category, using an ordinal color scale based on the Spectral scheme. Hovering over a country highlights it in red, while clicking a color legend item filters the map to show only countries in that category, dimming all others. Built with D3 v5, it renders countries as SVG paths using the geoNaturalEarth1 projection, and loads country boundaries and attributes from the world-atlas TopoJSON and TSV datasets. The interactive legend and zoom behavior are implemented through the D3 selection API and the custom zoom event handler.

LLaura Molina
93% match
Loading thumbnail…

Choropleth Map with Interactive Filtering

This choropleth map colors countries by their economy category and includes an interactive color legend for filtering. Hovering a legend item highlights matching countries and dims all others, while clicking toggles the selection. The visualization uses d3.geoNaturalEarth1 and d3.geoPath for geographic projection, d3.scaleOrdinal with schemeSpectral for coloring, and d3.zoom for panning. Data comes from the world-atlas TopoJSON and TSV files, rendered as SVG paths with click-driven state updates.

JJunyanL
93% match
Loading thumbnail…

Choropleth Map with Interactive Filtering

A choropleth map of global economies uses color to distinguish categories, with an interactive legend enabling users to click a category and highlight matching countries while dimming the rest. Built with D3 v5, the visualization uses `geoNaturalEarth1` and `geoPath` for map projection, `scaleOrdinal` and `schemeSpectral` for coloring, and `zoom` for panning. Data comes from the World Atlas TopoJSON and TSV files. Hovering reveals country names and values via SVG `title` elements.

Jjesramyep1263
93% match
Loading thumbnail…

Choropleth Map with Interactive Filtering

A world choropleth map colors countries by their economy category, with an interactive color legend that filters which countries remain highlighted. Built with D3 v5, it uses `geoNaturalEarth1` projection with `geoPath` for geographic rendering, `zoom` for panning and scaling, and a `scaleOrdinal` with a spectral scheme for categorical colors. Data comes from TopoJSON world-atlas files merged with TSV metadata, and clicking a legend tick dims all non-matching countries.

MMichał Szumnarski
93% 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
93% match
Loading thumbnail…

Choropleth Map with Interactive Practice

This visualization presents a world choropleth map coloring countries by economic classification using a spectral color scale, with an interactive legend that filters highlighted countries on click. Built with D3 v5, it employs `d3.geoNaturalEarth1` for projection, `d3.geoPath` for rendering, and `d3.zoom` for panning and zooming. Country data comes from the World Atlas TopoJSON and TSV files, while the legend uses `d3.scaleOrdinal` and `d3.schemeSpectral`. Hovering over a country turns it red, and the legend’s clickable ticks dim non-selected categories.

Ccpsshan
93% match
Loading thumbnail…

Choropleth Map with Interactive Practice

This visualization presents a world choropleth map coloring countries by economic classification using a spectral color scale, with an interactive legend that filters highlighted countries on click. Built with D3 v5, it employs `d3.geoNaturalEarth1` for projection, `d3.geoPath` for rendering, and `d3.zoom` for panning and zooming. Country data comes from the World Atlas TopoJSON and TSV files, while the legend uses `d3.scaleOrdinal` and `d3.schemeSpectral`. Hovering over a country turns it red, and the legend’s clickable ticks dim non-selected categories.

Ccpsshan
93% match
Loading thumbnail…

Choropleth Map with Interactive Filtering

This interactive choropleth map displays world economic data using a D3.js SVG rendering with a `geoNaturalEarth1` projection and `geoPath`. A spectral ordinal color scale maps each country's economy category. Users can hover over legend items to filter the map, dimming non-selected countries to 10% opacity while highlighting matching ones. The visualization uses `d3.scaleOrdinal`, `d3.schemeSpectral`, and a custom `colorLegend` module, loading data from the world-atlas TopoJSON and TSV files.

Rryansean1
93% match